Datatables get value of searchable on a column - datatables

Question

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();
});
});
}
} );
At the end, you can see that I have put a initComplete to have search columns to be at the bottom of each column.
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.
Thanks for your help.

Answer 1

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