Answers

• Caliweedjobs Posts: 10Questions: 3Answers: 0

  September 2018

  @colin any ideas?
• kthorngren Posts: 21,352Questions: 26Answers: 4,955

  September 2018

  Not sure which example you are referring to so its hard to provide more details.
  One option is to use use the column().search() api to perform the search when the button is clicked.

  This example is not specifically what you want (created it for something else) it may help you get started.

  http://live.datatables.net/metazuzi/1/edit

  Kevin
• Caliweedjobs Posts: 10Questions: 3Answers: 0

  September 2018

  Hi @kthorngren thanks so much for the reply, your example is great although it's a little different because it is a text input as opposed to using a button.

  You weren't clear on my example so let me add more context. I added a button to my site with the id = 'lab_jobs' to use with my datatable. I want the datatable to display only jobs where Category = 'Research' when the button is clicked.

  

  here is my datatables script code:
  <script> $(document).ready( function() { $('#datatables0').DataTable({ "order": [ 3, 'desc' ], "lengthMenu": [ 25, 50, 75, 100 ], scrollCollapse: true, "scrollX": true, "search": {"search":"{{ search_job_title }}"} }); }); </script>
  and the html file:

  

  You can find the page here as well if you want to see it:
  www.caliweedjobs.com

  Thank you again for any assistance! -Ian
• kthorngren Posts: 21,352Questions: 26Answers: 4,955

  September 2018 Answer ✓

  Yes, the example I provided uses an input with a button. The key is to look at the function that is called when the button is clicked. Modifying that function a bit should do what you are asking for. Something like this maybe:

    $('#lab_jobs').on('click', function () {
      table.column(4).search('Research').draw();
    });
  

  Kevin
• Caliweedjobs Posts: 10Questions: 3Answers: 0

  September 2018

  Thank you, your code led me to the solution, I need to work with the button toggling but that's a bootstrap issue. Here's what worked for me, I actually needed to search multiple values (Research AND Science) so I had to add some Regex

  <script>
  $(document).ready( function() {
      $('#datatables0').DataTable({
        "order": [ 3, 'desc' ],
        "lengthMenu": [ 25, 50, 75, 100 ],
        scrollCollapse: true,
        "scrollX": true,
        "search": {"search":"{{ search_job_title }}"}
      });
      var table = $('#datatables0').DataTable();
      $('#lab_jobs').on('click', function () {
        table
          .column( 4 )
          .search('Research|Science', true, false)
          .draw();
      });
  });
  </script>