Yo prefiero trabajar los filtrados personalizados como los ofrece el plugin datatables, es muy sencillo.
Acá un ejemplo práctico:
Html del filtrado:
<div class="form-group">
<label for="filter_campo" class="control-label col-md-2">Nombre: </label>
<div class="col-md-10">
<input type="text" class="form-control" id="filter_campo" name="filter_campo">
</div>
</div>
<br/><br/>
<div class="form-group">
<label for="estados" class="control-label col-md-2">Estado: </label>
<div class="col-md-10">
<select id='estados' name='estados' class='form-control'>
<option value="" disabled="disabled" selected="true">Elija...</option>
<option value="true">Activos</option>
<option value="false">Inactivos</option>
<option value="">Todos</option>
</select>
</div>
</div>
Html de la tabla:
<table class="display" id="table" cellspacing="0" width="100%">
<thead>
<tr>
<th>Nº</th>
<th>Procesos Productivos</th>
<th>Nombre</th>
<th>Estado</th>
<th>Acción</th>
</tr>
</thead>
<tfoot>
<tr>
<th>Nº</th>
<th>Procesos Productivos</th>
<th>Nombre</th>
<th>Estado</th>
<th>Acción</th>
</tr>
</tfoot>
</table>
Ajax donde formo mi datatables en la vista:
var table = $('#table').DataTable({
"filter": false,
"destroy": true,
"responsive": true,
"processing": true,
"serverSide": true,
"ajax": {
url: 'tabla/procesos',
global: false,
method: 'POST',
data: function (d) {
d.campo = $('input[name=filter_campo]').val();//aca obtengo el valor del campo "filter_campo"
d.status = $('select[name=estados]').val();//aca obtengo el valor del select "estados"
}
},
"columns": [
{data: 0, searchable: false, orderable: false, render: function( data, type, full, meta ){
return meta.row+1;
}
},
{data: 1},
{data: 2},
{"render": function ( data, type, row ) {
return ButtonEstado(row[3]);
}},
{"render": function () {
return ButtonEditar() + ' ' + ButtonEliminar();
}},
],
"fnDrawCallback": function() {
StyleCheckbox();
},
order: [[1, 'asc']],
"language": {
"url": "js/idioma_espaniol_datatables.js"
},
initComplete: function (data) {
$('#filter_campo').keyup(function(e) { //cada vez que suelta una tecla
table.draw(); //refresca la tabla
e.preventDefault();
});
$('#estados').on( 'change', function (e) {//cada vez que cambia de valor el select
table.draw(); //refresca la tabla
e.preventDefault();
});
}
});
Controlador:
$sql = Procesos::select(array
(
'procesos.id',
'ldp.nombre as ldp',
'procesos.nombre',
'procesos.status',
'procesos.id_lineas_de_produccion'
)
)
->join('lineas_de_produccion as ldp','procesos.id_lineas_de_produccion','=','ldp.id');
return Datatables::of($sql)
->filter(function ($query) use ($request) {
if ($request->has('campo')) { //aca verifico que el campo exista
$query->where('nombre', 'ilike', "%{$request->get('campo')}%"); //y aca realizo la busqueda por ilike a través del valor del campo de la vista
}
if ($request->has('status')) { //aca verifico que el campo exista
$query->where('status', '=', "{$request->get('status')}"); //aca realizo filtro la consulta por el where cuando sea status
}
//estos filtrados los puedes usar a tu creatividad, yo tengo algunos muchos mas complejos. Todo depende de ti.
})
->make();
La fuente donde aprendi a hacerlo es este enlace.
Actualización 1
Como dice en los comentario el user @AngelFragaParodi no especifique de que lado es el filtrado, pues es del lado del servidor, y el ejemplo que doy esta hecho con laravel. Con un poco de conocimientos se puede migrar a otro framework tranquilamente, unas que otras búsquedas en google lo solucionan, solo es cuestión de indagar un poquito mas. Pero la esencia del filtrado personalizado ya la plasme :D