vedmack / yadcf

Yet Another DataTables Column Filter (yadcf)
http://yadcf-showcase.appspot.com/
MIT License
732 stars 285 forks source link

yadcf.exFilterExternallyTriggered #683

Closed 13ran closed 3 weeks ago

13ran commented 3 weeks ago

I can't figure out what I am doing wrong. I am calling yadcf.exFilterExternallyTriggered(dtcustomers); it makes the request but it does not contain the search text from the input. Html: <input type="text" id="name" name="name" placeholder="" class="form-control">

Javascript:

dtcustomers = $('#customers').DataTable({
      rowId: 'rowId',
      responsive: {
         details: true
      },
      serverSide: true,
      ajax: {
        url: 'api?get=CustomersTable',
        type: "POST",
        timeout: 10000,
      },
      "order": 
      [
         [ 0, "desc" ]
      ],
      columns: 
      [
         { data: 'VehicleCustomerId' },
         { data: 'VehicleDocumentId' },
         { data: 'DriversLicense' },
         { data: 'GstNumber' },
         { data: 'FirstName' },
         { data: 'LastName' },
         { data: 'CompanyName' },
         { data: 'Phone' },
         { data: 'Fax' },
         { data: 'Street' },
         { data: 'Province' },
         { data: 'PostalCode' },
         { data: 'Email' },
         { data: 'Notes' },
         { data: 'Name' },
         { data: 'City' }
      ]
});

yadcf.init(dtcustomers, 
   [
      {
         column_number: 6,
         filter_container_id: 'name',
         filter_match_mode: 'contains',
         filter_type: "text",
         externally_triggered: true
      }
   ],{   externally_triggered: true});
13ran commented 3 weeks ago

So I was able to get it working with the code below. But it causes a double ajax call. The first without the search query and the second with the search query. Is there a way to avoid the double ajax call or another way to do this?

$('#SubmitFormButton').on('click', function() {
   var filters = [
      [6, $('#name').val()]
   ];
   yadcf.exResetAllFilters(dtcustomers,true);
   yadcf.exFilterColumn(dtcustomers, filters);
   yadcf.exFilterExternallyTriggered(dtcustomers);
});
vedmack commented 3 weeks ago

@13ran all you have to call from inside that button is exFilterExternallyTriggered see the showcase page and look into the source code of the filter button https://yadcf-showcase.appspot.com/dom_source_externally_triggered.html

13ran commented 3 weeks ago

Yes I see now it generates the input for me. I misunderstood what the externally triggered meant. I wanted it to use my own input.

vedmack commented 3 weeks ago

then u can use filter_container_id: "external_filter_container" like in this showcase page https://yadcf-showcase.appspot.com/DOM_source.html

u can go over the showcase examples and see what fits u the best