Question

我使用以下代码创建了一个数据表：

userTable = $('#userTable').DataTable({
                serverSide: true,
                processing: true,
                ajax: {
                        url: "{!! route('listOfUsersAjax') !!}",
                        type: "GET",
                        dataSrc: function ( json ) {
                          //console.log(json);;
                            for ( var i=0, ien=json.data.length ; i<ien ; i++ ) {
                                if (json.data[i].is_manager == 1){
                                    json.data[i].is_manager = 'Yes';
                                }
                                else {
                                    json.data[i].is_manager = 'No';
                                }
                            }
                            return json.data;
                        }
                    },
                columns: [
                    {
                        className:      'details-control',
                        orderable:      false,
                        searchable:     false,
                        data:           null,
                        defaultContent: ''
                    },
                    { name: 'id', data: 'id' },
                    { name: 'name', data: 'name' },
                    { name: 'email', data: 'email' },
                    { name: 'is_manager', data: 'is_manager'},
                    { name: 'region', data: 'region' },
                    { name: 'country', data: 'country' },
                    { name: 'domain', data: 'domain' },
                    { name: 'management_code', data: 'management_code' },
                    { name: 'job_role', data: 'job_role' },
                    { name: 'employee_type', data: 'employee_type' },
                    {
                        name: 'actions',
                        data: null,
                        sortable: false,
                        searchable: false,
                        render: function (data) {
                            var actions = '';
                            actions += '<div class="btn-group btn-group-xs">';
                            actions += '<button data-toggle="tooltip" title="view" id="'+data.id+'" class="buttonView btn btn-success"><span class="glyphicon glyphicon-eye-open"></span></button>';
                            actions += '<button data-toggle="tooltip" title="edit" id="'+data.id+'" class="buttonUpdate btn btn-primary"><span class="glyphicon glyphicon-pencil"></span></button>';
                            actions += '<button data-toggle="tooltip" title="delete" id="'+data.id+'" class="buttonDelete btn btn-danger"><span class="glyphicon glyphicon-trash"></span></button>';
                            actions += '</div>';
                            return actions;
                        }
                    }
                    ],
                columnDefs: [
                    {
                        "targets": [1,3,4], "visible": false, "searchable": false
                    }
                    ],
                order: [[2, 'asc']],
                initComplete: function () {
                    this.api().columns().every(function () {
                        var column = this;
                        //console.log(userTable);
                        // Now we need to skip the first column as it is used for the drawer...
                        if(column[0][0] == '0' || column[0][0] == '11'){return true;};
                        var input = document.createElement("input");
                        $(input).appendTo($(column.footer()).empty())
                        .on('keyup change', function () {
                            column.search($(this).val(), false, false, true).draw();
                        });
                    });
                }
            } );

最后，您可以看到我已经放置了一个initComplete，以使搜索列位于每列的底部。

当列不可搜索时，我不需要搜索，例如，第一列和最后一列，因为它不可搜索。我正在使用列的编号并返回true，因此它不会创建它，但我想要更动态的东西，并且if列可搜索为false然后返回true，这样我不需要指定数字列。

感谢您的帮助。

Answer 1

您做通过columns提供this.api().init().columns定义。因此，您所要做的就是评估列searchable显式是否设置为false（未定义可搜索或未定义列的方式为true，因为这是默认值）：

initComplete: function() {
  var columns = this.api().init().columns;
  this.api().columns().every(function(index) {
    if (!columns[index] || columns[index].searchable) {
       // column is searchable
     } else {
       // column is not searchable           
     }
   })  
 }

数据表获得列上可搜索的值

1 个答案: