Multi column search

automatem

I have some search fields on the same page as DataTable(). I have built this search function to submit all field content when any field has data changed:

 dt = jQuery('#rowblock').DataTable({
          "processing": true,
          "serverSide": true,
          "searching": false,
          "lengthMenu": [[25, 100, -1], [25, 100, "All"]],
          "sPaginationType": "full_numbers",
          "ajax": 'admin.php?gadmtable=&gadmaction=getgriddata',
          "columnDefs": [{
              "targets": [ 8,11,12,13 ],
                         "render": function ( data, type, full, meta ) {
                             if (type === "display"){
                                 return jQuery("<div />").html(full[meta.col]).text();
                             }else{
                                 return data;
                             }
                        } 
          } ]
      });


  function search(){
      var search = [];
      jQuery('#filterfields :input').each(function() {
          search.push(this.value);
      })
      dt.search( search.join('&'))
      .draw();
  }

However I see no parameter added to the GET request, all search parameters are empty. Any idea what I am missing?

allan

No I'm afraid - that looks like it should work okay on a quick scan. Could you link to a page showing the issue please.

Allan

automatem

Hmm, can't get it to work in this fiddle: https://jsfiddle.net/fknjm1pw/2/ at all. Seems like the jQuery.noConflict() is not working?

allan

Nothing to do with $.noConflict - the URL used to load jQuery is incomplete ( https://code.jquery.com/jquery-1.11.2.min.j ) - missing s (the browser's console shows a 404 error).

The other major issue is that you want to use searching but you have "searching": false, :-). If you don't want the built in global filter just remove it using dom.

However, I think I would suggest a different approach from the one you have taken here. The main issue that I can see is that you are using Array.join() to join the field values - but how is the server to know what parameter each element in the array corresponds to. Is the order always going to be in the DOM order?

I would suggest you use ajax.data to get the value from each search input element and assign it to a property which the server can then access an use.

Allan

automatem

Hi Allan,

thanks, that works now.

In regards to the option of sending the data differently, I already have a framework for this particular app, which holds the schema data and where there are filter fields. I just wanted to get around needing to name fields etc and so far so good.

For any future project I would use https://packagist.org/packages/sg/datatablesbundle