ExtJS 3.4 добавить кнопку в нижней части сетки

Question

Я новичок в ExtJS и попытаюсь добавить кнопку в нижней части сетки. Эта кнопка откроет модальный диалог, чтобы выбрать больше людей. Я не знаю, как добавить эту кнопку после сетки. Должен ли я использовать другой компонент, чем GridPanel?

Может кто-нибудь мне помочь?

код выглядит следующим образом:

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

ли вы имеете в виду что-то вроде нижней панели?

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' 
      } 
     ] 
     })