DataTables 根据查询显示不同的按钮

Question

我使用 jquery DataTables 来获取数据。我想show/hidecolumnDefs:edit按钮根据查询数据，数据有一项'edit'：0-隐藏编辑按钮，1-显示编辑按钮

$('#buget_table').dataTable( {
            "aLengthMenu": [[10, 50, 100, -1], [10, 50, 100, "All"]],
            "ajax": {
                "url": "{{ url('buget.owt_index') }}",
                "type": "POST"
            },
            "columns": [
                { "data": "id", 'searchable': true},
                { "data": "machine_type", 'searchable': true },
                { "data": "machine_room", 'searchable': true },
                { "data": "machine_nums", 'searchable': true },
                { "data": "cpu_nums", 'searchable': true },
                { "data": "mem_nums", 'searchable': true },
                { "data": "disk_type", 'searchable': true },
                { "data": "disk_nums", 'searchable': true },
                { "data": "commit_user", 'searchable': true },
                { "data": "commit_time", 'searchable': true },
            ],
            "columnDefs": [{
                    "render": function (data, type, full) {
                        return '<a id="owt_edit" data-toggle="modal" data-target="#buget-modal"   class="btn btn-primary btn-sm" href="/buget/buget_query/?action=edit&html=1&id=' +full['id']+ '">detail</a>' +
                                '<a id="owt_delete" data-toggle="modal" class="btn btn-danger btn-sm" href="javascript:void(0)" onclick=edit_buget("' + full['id'] +'");>edit</a>';
                    },
                    "targets": 10,
            }],
        });

Answer 1

我不确定我是否清楚这个问题，但听起来您需要呈现数据对象的 edit 属性。起初我以为你想要渲染函数中使用的最后一个搜索，所以我把它保留在评论中，以防万一。

$('#buget_table').dataTable( {
    "aLengthMenu": [[10, 50, 100, -1], [10, 50, 100, "All"]],
    "ajax": {
        "url": "{{ url('buget.owt_index') }}",
        "type": "POST"
    },
    "columns": [
        { "data": "id", 'searchable': true},
        { "data": "machine_type", 'searchable': true },
        { "data": "machine_room", 'searchable': true },
        { "data": "machine_nums", 'searchable': true },
        { "data": "cpu_nums", 'searchable': true },
        { "data": "mem_nums", 'searchable': true },
        { "data": "disk_type", 'searchable': true },
        { "data": "disk_nums", 'searchable': true },
        { "data": "commit_user", 'searchable': true },
        { "data": "commit_time", 'searchable': true },
        { 
            data: "edit", 
            searchable: false,
            render: function (data, type, full, meta) {
                if((type === "display")
                {
                    var results = '<any other button>';
                    //var api = new $.fn.dataTable.Api( meta.settings );
                    //var query = api.search();

                    //if((query || query === 0))
                    if(data)
                    {
                        results = '<Your edit button>' + results;
                    }

                    return results;
                }

                return data;
            }
        }
    ]
});

DataTables 根据查询显示不同的按钮

DataTables show different button according to query

jquery

datatables

show-hide