數據表得到

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評估（不定義搜索或不定義列都意味着真實的，因爲這是默認值）：

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