如何使用SlickGrid插件在每一行上创建删除按钮？

如何使用SlickGrid插件在每一行上创建删除按钮？ 我需要一个可以删除整个相应行的按钮。

Answer 1

使用列格式化程序完成此操作。

var column = {id:delCol, field:'del', name:'Delete', width:250, formatter:buttonFormatter} //Now define your buttonFormatter function function buttonFormatter(row,cell,value,columnDef,dataContext){ var button = ""; //the id is so that you can identify the row when the particular button is clicked return button; //Now the row will display your button } //Now you can use jquery to hook up your delete button event $('.del').live('click', function(){ var me = $(this), id = me.attr('id'); //assuming you have used a dataView to create your grid //also assuming that its variable name is called 'dataView' //use the following code to get the item to be deleted from it dataView.deleteItem(id); //This is possible because in the formatter we have assigned the row id itself as the button id; //now assuming your grid is called 'grid' grid.invalidate(); }); 

Answer 2

使用jQuery绑定到click事件的另一种方法是使用SlickGrid的onClick事件。 类似于（现已弃用）jQuery .live（）或现在.on（）与委派处理程序，使用onClick将允许function工作，而无需在添加，删除，显示等新行时不断重新附加处理程序。

增强Jibi的例子，用以下内容替换$('.del').live('click', function(){ …

 // assuming grid is the var name containing your grid grid.onClick.subscribe( function (e, args) { // if the delete column (where field was assigned 'del' in the column definition) if (args.grid.getColumns()[args.cell].field == 'del') { // perform delete // assume delete function uses data field id; simply pass args.row if row number is accepted for delete dataView.deleteItem(args.grid.getDataItem(args.row).id); args.grid.invalidate(); } });