Datatable column filtering
HTML
<link rel="stylesheet" href="https://cdn.datatables.net/v/dt/jq-3.3.1/jszip-2.5.0/dt-1.10.20/af-2.3.4/b-1.6.1/b-colvis-1.6.1/b-flash-1.6.1/b-html5-1.6.1/b-print-1.6.1/cr-1.5.2/fc-3.3.0/fh-3.1.6/kt-2.5.1/r-2.2.3/rg-1.1.1/rr-1.2.6/sc-2.0.1/sp-1.0.1/sl-1.3.1/datatables.css">
<script src="https://cdn.datatables.net/v/dt/jq-3.3.1/jszip-2.5.0/dt-1.10.20/af-2.3.4/b-1.6.1/b-colvis-1.6.1/b-flash-1.6.1/b-html5-1.6.1/b-print-1.6.1/cr-1.5.2/fc-3.3.0/fh-3.1.6/kt-2.5.1/r-2.2.3/rg-1.1.1/rr-1.2.6/sc-2.0.1/sp-1.0.1/sl-1.3.1/datatables.js"></script>
<table id="example" class="display" style="width:100%">
<thead>
<tr>
<th>ID</th>
<th>Pares</th>
<th>Valor</th>
</tr>
</thead>
<tbody>
<tr>
<td>123</td>
<td>5.300</td>
<td>USD 12.785,76</td>
</tr>
<tr>
<td>345</td>
<td>3.870</td>
<td>USD 9.876,87</td>
</tr>
<tr>
<td>456</td>
<td>2.876</td>
<td>USD 7.897,55</td>
</tr>
</tbody>
</table>
JavaScript
$(document).ready(function() {
$('#example').DataTable({
"info": false,
"responsive": true,
'order': [],
'pageLength': 10,
'language': {
'decimal': ',',
'thousands': '.',
},
'columnDefs': [
{
'targets': 2,
'render': function (data, type, row) {
if (type === 'sort' || type === 'filter' || type == 'type') {
data = data.replace('USD ','');
data = data.replace('.', ''); // Remove the periods
data = data.replace(',', '.'); // Use period for fractional part
console.log(data);
return data.trim();
}
return data;
}
}
]
});
} );