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