diff --git a/.datatables-commit-sync b/.datatables-commit-sync index 05f64964..5b56166c 100644 --- a/.datatables-commit-sync +++ b/.datatables-commit-sync @@ -1 +1 @@ -37dd3d0ac908239527d4946e5b4c994ceb982fbc +9ba4130c47db42b98a39a3d8cc8c8a40f0828529 diff --git a/examples/api/multi_filter.html b/examples/api/multi_filter.html index 7db805b2..f0971573 100644 --- a/examples/api/multi_filter.html +++ b/examples/api/multi_filter.html @@ -11,6 +11,12 @@ @@ -28,13 +34,15 @@ $(document).ready(function() { // DataTable var table = $('#example').DataTable(); - + // Apply the filter - $("#example tfoot input").on( 'keyup change', function () { - table - .column( $(this).parent().index()+':visible' ) - .search( this.value ) - .draw(); + table.columns().eq( 0 ).each( function ( colIdx ) { + $( 'input', table.column( colIdx ).footer() ).on( 'keyup change', function () { + table + .column( colIdx ) + .search( this.value ) + .draw(); + } ); } ); } ); @@ -575,13 +583,15 @@ $(document).ready(function() { // DataTable var table = $('#example').DataTable(); - + // Apply the filter - $("#example tfoot input").on( 'keyup change', function () { - table - .column( $(this).parent().index()+':visible' ) - .search( this.value ) - .draw(); + table.columns().eq( 0 ).each( function ( colIdx ) { + $( 'input', table.column( colIdx ).footer() ).on( 'keyup change', function () { + table + .column( colIdx ) + .search( this.value ) + .draw(); + } ); } ); } ); @@ -603,7 +613,11 @@ $(document).ready(function() {
This example uses a little bit of additional CSS beyond what is loaded from the library files (below), in order to correctly display the table. The additional CSS used is shown - below:
+ below:tfoot input {
+ width: 100%;
+ padding: 3px;
+ box-sizing: border-box;
+ }
The following CSS library files are loaded for use in this example to provide the styling of the
diff --git a/examples/api/multi_filter_select.html b/examples/api/multi_filter_select.html
index 7b5e182a..9e6466e2 100644
--- a/examples/api/multi_filter_select.html
+++ b/examples/api/multi_filter_select.html
@@ -27,7 +27,7 @@ $(document).ready(function() {
.appendTo( $(this).empty() )
.on( 'change', function () {
table.column( i )
- .search( $(this).val() )
+ .search( '^'+$(this).val()+'$', true, false )
.draw();
} );
@@ -63,6 +63,15 @@ $(document).ready(function() {
"HTML tag">select input is used to trigger a column search using the column().search()DT
method.
Note that the column().search()DT
method in this particular case
+ performs an exact match through the use of a custom regular expression and disabling DataTables built
+ in smart searching. For more information on the search options in DataTables API please refer to the
+ documentation for search()DT
and column().search()DT
.