如何使用添加新按鈕在w2ui網格中添加新項目？

Question

我第一次使用w2ui網格。我想在網格中添加新項目。爲此我顯示toolbarAdd是工具欄。但是當我點擊它時，沒有任何反應。我如何添加新項目？

$('#grid').w2grid({ 
    name: 'grid', 
    header: 'List of Names', 
    show: { 
     toolbar: true, 
     footer: true, 
     toolbarAdd: true, 
     toolbarEdit: true, 
     toolbarDelete: true, 
     toolbarSave: true 
    }, 
    columns: [ 
     { field: 'fname', caption: 'First Name', size: '30%' }, 
     { field: 'lname', caption: 'Last Name', size: '30%' }, 
     { field: 'email', caption: 'Email', size: '40%' }, 
     { field: 'sdate', caption: 'Start Date', size: '120px' } 
    ] 

Answer 1

您需要自己實現邏輯。

網格怎麼知道你要添加什麼？

例如：

function addRecord() { 
    var g = w2ui['grid'].records.length; 
    w2ui['grid'].add({ recid: g + 1, fname: 'Jin', lname: 'Franson', email: 'jdoe@gmail.com', sdate: '4/3/2012' }); 
} 

$('#grid').w2grid({ 
    name: 'grid', 
    ... 
    onAdd: function (event) { 
     addRecord(); 
    }, 
    ... 
}); 

你基本上要更多的條目添加到您的grid.records。

這裏與點擊工具欄上的處理程序實現另一個例子：

http://w2ui.com/web/demos/#!grid/grid-21

$('#grid').w2grid({ 
    name: 'grid', 
    ... 
    toolbar: { 
     items: [ 
      { id: 'add', type: 'button', caption: 'Add Record', icon: 'w2ui-icon-plus' } 
     ], 
     onClick: function (event) { 
      if (event.target == 'add') { 
       w2ui.grid.add({ recid: w2ui.grid.records.length + 1 }); 
      } 
     } 
    }, 
    ... 
});