How to change yajra dataTable search filtering system?

问题

Suppose i write in datatable search box 'b' then it will normally show 'abc','ybu','break','brain' etc .but i want to get only 'break','brain' (start with b).that means when i write something word ,it will show me word that start with that. i am using yajra DataTables 1.10.10.

Edit

i solved this prob but now facing new prob when i try to use two datatables ,it stop to show one datatable tbody datas but another datatable work properly

$.fn.dataTableExt.afnFiltering.push(
      function(oSettings, aData, iDataIndex) {
          var keywords = $(".dataTables_filter input").val().split(' ');  
          var matches = 0;
          for (var k=0; k<keywords.length; k++) {
              var keyword = keywords[k];
              for (var col=0; col<aData.length; col++) {
                  if (aData[col].charAt(0).toLowerCase() == keyword.charAt(0).toLowerCase()) {
                      matches++;
                      break;
                  }
              }
          }
          return matches == keywords.length;
       }
    );
 $('.table2id').dataTable({
 });
 $('.table1id').dataTable({
});

finally solved it

var ptable = $('#table2').DataTable();
var rtable = $('#table1').DataTable();

var term;
$('#table1_filter input[type="search"]').keyup(function(e){
    console.log("table1_filter");
    var term = $(this).val();

    regex = '^' + term ;
    rtable.column( 0 ).search( regex, true, false ).draw();

});
$('#table2_filter input[type="search"]').keyup(function(e){

    term = $(this).val();
    regex = '^' + term ;
    ptable.column( 0 ).search( regex, true, false ).draw(); 

});

回答1:

You can do it using RegEx.
Sample code-

$('input[type="search"]').keyup(function(){
    var term = $(this).val(),
    regex = '^' + term ;
    table.search( regex, true, false ).draw();
});

Working JsFiddle. But it can be applicable to column wise only.
for example-

table.column(0).search( regex, true, false ).draw();

Here we are applying search regex to first column only.

回答2:

Final answer:

var ptable = $('#table2').DataTable();
var rtable = $('#table1').DataTable();

var term;
$('#table1_filter input[type="search"]').keyup(function(e){
    console.log("table1_filter");
    var term = $(this).val();

    regex = '^' + term ;
    rtable.column( 0 ).search( regex, true, false ).draw();

});
$('#table2_filter input[type="search"]').keyup(function(e){

    term = $(this).val();
    regex = '^' + term ;
    ptable.column( 0 ).search( regex, true, false ).draw(); 

});

Another Solution:(not work for multi datatables in same page)

$.fn.dataTableExt.afnFiltering.push(
      function(oSettings, aData, iDataIndex) {
          var keywords = $(".dataTables_filter input").val().split(' ');  
          var matches = 0;
          for (var k=0; k<keywords.length; k++) {
              var keyword = keywords[k];
              for (var col=0; col<aData.length; col++) {
                  if (aData[col].charAt(0).toLowerCase() == keyword.charAt(0).toLowerCase()) {
                      matches++;
                      break;
                  }
              }
          }
          return matches == keywords.length;
       }
    );
      $('.tableid').dataTable({

      });

来源：https://stackoverflow.com/questions/39119015/how-to-change-yajra-datatable-search-filtering-system

标签

jquery

filter

datatable