数据表按钮启用/禁用示例不起作用

问题描述

我使用带有自定义按钮的数据表.我正在查看 examples，也用谷歌搜索了一下，但我没有找不到可行的解决方案.

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 );
} );

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

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
},

推荐答案

您需要为取消选择添加一个事件处理程序.参见 https://datatables.net/reference/event/deselect

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();
} );

至于获取行 ID，可以在此处找到示例

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

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