Improved Search Funciton

I tried to use the default search function and didn’t like it at all. So I created my own.

I am posting my solution in hopes that the author will include it in the next release.

It uses jQuery with a search function to search through the whole table for the text and then if it doesn’t find it, it auto-hides that element. If nothing is found it shows “We are sorry, we can’t seem to find that.”

Screenshots:
1 – https://www.dropbox.com/s/3kkwaptp0q4eyaj/1.png?dl=0
2 – https://www.dropbox.com/s/ifo0ry73wl0jqvw/2.png?dl=0
3 – https://www.dropbox.com/s/cfi1lbhegeu21ub/3.png?dl=0

I know this isn’t the ideal way to do it… but it works.

Example code:

[button type="big"] Submit Your Business[/button]

<form>
<input type="text" id="tableSorterInput" placeholder="Search here...">
</form>

[directory form="1"]

<script>

       jQuery(document).ready(function ($) {
           $('#lead_form').remove();
           $('table tr:last')
              .after('<tr class="notfound" role="row"><td colspan="3"><p>We are sorry, we can\'t seem to find that.</p></td</tr>');
           $("#tableSorterInput").keyup(function () {
               var value = this.value.toLowerCase().trim();
               var rows = $("table tr.items").length;
               $("table tr.items").each(function (index) {

               var not_found;
               let thisrow = $(this);

                   $(this).find("td").each(function () {
                       

                       if ( $(this).attr('title') == 'Business Name' ) {

                           var idx = $(this).text().toLowerCase().trim();
                           not_found = (idx.indexOf(value) == -1);
                           if (not_found) {rows--;}
                           thisrow.toggle(!not_found);

                       }

                   });

   });

       console.log('rows '+rows);
       if (rows <= 0) {
       $(".notfound").show();
       console.log("---"); }

   else {
       if ($(".notfound").hasClass("notfound"))
       console.log("+++++");
       $(".notfound").hide();}

});

       });

   </script>