ExtJS 3.4 Schaltfläche am unteren Rand eines Gitters hinzufügen

Question

Ich bin neu bei ExtJS und versuche, eine Schaltfläche am unteren Rand des Rasters hinzuzufügen. Diese Schaltfläche öffnet einen modalen Dialog, um mehr Personen auszuwählen. Ich weiß nicht, wie ich diese Schaltfläche nach dem Raster hinzufügen soll. Muss ich eine andere Komponente als GridPanel verwenden?

Kann mir jemand helfen?

Der Code sieht so aus:

var selectedPersons = [ 
    [1, 'Persnr', 'Name', 'Vorname'] 
]; 

var store = new Ext.data.ArrayStore({ 
    fields: [ 
     {name: 'PrsOid', type: 'int'}, 
     {name: 'PersonalNr'}, 
     {name: 'Nachname'}, 
     {name: 'Vorname'} 
    ] 
}); 

store.loadData(selectedPersons); 

var grid = new Ext.grid.GridPanel({ 
    store: store, 
    columns: 
    [ 
     { 
      id  : 'PersonalNr', 
      header : 'PersonalNr', 
      width : 100, 
      sortable : true, 
      dataIndex: 'PersonalNr' 
     }, 
     { 
      header : 'Nachname', 
      width : 100, 
      sortable : true, 
      dataIndex: 'Nachname' 
     }, 
     { 
      header : 'Vorname', 
      width : 100, 
      sortable : true, 
      dataIndex: 'Vorname' 
     } 
    ], 
    stripeRows: true, 
    autoExpandColumn: 'PersonalNr', 
    height: 200, 
    //width: 460, 
    title: 'Personenauswahl', 
    // config options for stateful behavior 
    stateful: true, 
    stateId: 'grid' 
    }); 

    grid.render('gridSelectedPersons'); 

Answer 1

Sie so etwas wie eine Bodenstange bedeuten Sie?

var grid = new Ext.grid.GridPanel({ 
    store: store, 
    columns: 
    [ 
     .... 
    ], 
    stripeRows: true, 
    autoExpandColumn: 'PersonalNr', 
    bbar: new Ext.Toolbar({ 
     renderTo: document.body, 
     height: 30, 
     items: [ 
      // begin using the right-justified button container 
      '->', 
      { 
      xtype:'button', 
      text:'The button', 
      //makes the button 24px high, there is also 'large' for this config 
      scale: 'medium' 
      } 
     ] 
     })