数据表按钮启用/禁用示例不工作 [英] datatables buttons enable/disable example not working

问题描述

我正在使用具有自定义按钮的数据。我正在查看示例，同时也搜索了一下，但我没有没有找到一个工作的解决方案。

问题是，当我取消选择该行时，该按钮仍然启用。选择/取消选择行时，启用/禁用按钮的方法是什么？

  var table = $（'＃示例'）DataTable（{
 serverSide：true，
 dom：'Bfrtip'，
 ajax：'/ get？op = 2'，
列：[
 {data：'id'}，
 // more columns 
]，
按钮：[
 {
 text：'New'，
 action ：function（e，dt，node，config）{
 window.location.href ='/ property？option = new'
} 
}，
 {
文本：'Modify'，
 action：function（e，dt，node，config）{
 window.location.href ='/ property？option = modify& id ='+ data.id 
}，
 enabled：false 
}，
 {
 text：'Delete'，
 action：function（e，dt，node，config）{
}，
 enabl ed：false 
} 
]，
 select：true 
}）; 
 
 table.on（'select'，function（）{
 var selectedRows = table.rows（{selected：true}）.count（）; 
 
 table.button（1）.enable（selectedRows === 1）; 
 table.button（2）.enable（selectedRows === 1）; 
 table.button（3）.enable（selectedRows === 1）; 
 //table.button（1）.enable（selectedRows> 0）; 
}）; 
  

另外如何获取所选行的id值？

  action：function（e，dt，node，config）{
 window.location.href ='/ property？option = modify& id =' + data.id 
}，
  

解决方案

你需要添加一个事件处理程序来取消选择。请参阅 https://datatables.net/reference/event/deselect

它应该像下面这样...

  table.on（'deselect'，function（） table.button（1）.disable（）; table.button（2）.disable（）; table.button（3）.disable（）;}）;  

至于获取行ID，可以找到一个示例 here

I'm using datatables with custom buttons. I'm looking in the examples, also googled a bit but I didn't find a working solution.

The problem is that, when I deselect the row the button is still enabled. What is the proper way to enable/disable the buttons when a row is selected/deselected?

var table = $('#example').DataTable( {
    serverSide: true,
    dom: 'Bfrtip',
    ajax: '/get?op=2',
    columns: [
        { data: 'id' },
        // more columns
    ],
    buttons: [
        {
            text: 'New',
            action: function ( e, dt, node, config ) {
                window.location.href = '/property?option=new'
            }
        },
        {
            text: 'Modify',
            action: function ( e, dt, node, config ) {
                window.location.href = '/property?option=modify&id=' + data.id
            },
            enabled: false
        },
        {
            text: 'Delete',
            action: function ( e, dt, node, config ) {
            },
            enabled: false
        }
    ],
    select: true
} );

table.on( 'select', function () {
    var selectedRows = table.rows( { selected: true } ).count();

    table.button( 1 ).enable( selectedRows === 1 );
    table.button( 2 ).enable( selectedRows === 1 );
    table.button( 3 ).enable( selectedRows === 1 );
    //table.button( 1 ).enable( selectedRows > 0 );
} );

Also how can I get the id value for the selected row?

action: function ( e, dt, node, config ) {
    window.location.href = '/property?option=modify&id=' + data.id
},

解决方案

You need to add an event handler for the deselect. see https://datatables.net/reference/event/deselect

It should be something like below...

table.on( 'deselect', function () {
    table.button( 1 ).disable();
    table.button( 2 ).disable();
    table.button( 3 ).disable();
} );

As for getting a row id an example can be found here

这篇关于数据表按钮启用/禁用示例不工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！