Tengo el siguiente Datatable, que estoy utilizando de prueba en mi App.
En las opciones que proporciona el API, tiene un campo para Buscar, ingresando texto, busca de forma dinamica en las columnas del Datatable. Mi duda radica en la siguiente:
¿Es posible, cambiar el tipo de campo de "Buscar" por una Lista de Selección? He encontrado en la documentación del API, que al final como "Footer" de cada columna, agrega listas de selección, lo cual no es lo que estoy buscando, sino cambiar el campo general, por una lista de selección.
Adjunto mi porción de código.
$(document).ready(function() {
$('#datatableTest').DataTable({
fixedHeader: true,
scrollX: true,
searching: true,
dom: 'Bfrtip',
buttons: [],
pageLength: 4,
language: {
search: 'Buscar',
zeroRecords: 'No hay registros para mostrar.',
emptyTable: 'La tabla está vacia.',
info: "Mostrando _START_ de _END_ de _TOTAL_ Registros.",
infoFiltered: "(Filtrados de _MAX_ Registros.)",
paginate: {
first: 'Primero',
previous: 'Anterior',
next: 'Siguiente',
last: 'Último'
}
}
});
});
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://code.jquery.com/jquery-3.5.1.js"></script>
<script src="//cdn.datatables.net/1.10.21/js/jquery.dataTables.min.js"></script>
<link href="//cdn.datatables.net/1.10.21/css/jquery.dataTables.min.css" rel="stylesheet" />
<table id="datatableTest" class="table table-striped table-bordered display nowrap" style="width:100%">
<thead align="center">
<tr>
<td> <strong> Current Year </strong> </td>
<td> <strong> Line </strong> </td>
<td> <strong> Id </strong> </td>
</tr>
</thead>
<tbody id="tableTBody" align="center">
<tr>
<td>2020</td>
<td>HNG</td>
<td>1</td>
</tr>
<tr>
<td>2019</td>
<td>SHR</td>
<td>2</td>
</tr>
<tr>
<td>2018</td>
<td>GH1</td>
<td>3</td>
</tr>
<tr>
<td>2010</td>
<td>PPL</td>
<td>4</td>
</tr>
<tr>
<td>2008</td>
<td>LP1</td>
<td>5</td>
</tr>
<tr>
<td>1991</td>
<td>GGR</td>
<td>6</td>
</tr>
</tbody>
</table>