数据表在列上获得可搜索的值 [英] Datatables get value of searchable on a column

问题描述

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

I have created a datatable with following code:

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放在搜索列中

At the end, you can see that I have put a initComplete to have search columns to be at the bottom of each column.

当该列不可搜索时，例如，由于第一列和最后一个列不可搜索，因此我不需要进行搜索。我正在使用列的编号并返回true，以便它不会创建它，但是我想要更动态的东西，并且if列searchable为false，然后以这种方式返回true，我不需要指定列。

I don't need to have a search when the column is not searchable, for example, first column and last one because it is not searchable. I am using the number of the column and returning true so that it doesn't create it but I would like something more dynamic and have an if column searchable is false then return true that way I don't need to specify the number of the column.

感谢您的帮助。

推荐答案

您 do 具有列的定义，可通过 this.api（）。init（）。columns 获得。因此，您要做的就是评估是否将显式列 searchable 设置为 false （未定义searchable定义列绝对意味着true，因为这是默认设置）：

You do have the columns definition available through this.api().init().columns. So all you have to do is to evaluate if a columns searchable explicit is set to false (not defining searchable or not defining the column at all means true, since this is the default) :

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

这篇关于数据表在列上获得可搜索的值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！