I have a list of checkboxes which shows values from database. If the user search for checkbox label text the searched string text show the checkboxes. I have tried in jsfiddle link . Cant get the matched string. https://jsfiddle.net/bd7anjqc/1/

$(document).ready(function() {
              $(".List_wrapper").keyup(function() {
                _this = this;
                // Show only matching TR, hide rest of them
                $.each($('#List_wrapper  >input[type="checkbox"]'), function() {
                  if ($(this).val().toLowerCase().indexOf($(_this).val().toLowerCase()) === -1)
                    $(this).hide();
                  else
                    $(this).show();
                });
              });
            });

CodePudding user response：

Check the fiddle: https://jsfiddle.net/h3cy4f6p/

      $(document).ready(function() {
          $("#search").keyup(function() {
              var to_search = $("#search").val().toLowerCase();
            
              $.each($('div.List_wrapper input[type="checkbox"]'), function() {            
                  var label = $(this).parent('label').text().toLowerCase().trim();
      
                  const string = '^'   to_search;
                  const regexp = new RegExp(string, 'i');

                  if (regexp.test(label)) {
                     $(this).parent('label').show();
                  } else {
                     $(this).parent('label').hide();
                  }
               });
            });
        });

The search uses regexp

CodePudding user response：

        $(document).ready(()=> {
          $("#search").keyup(()=> {
           $.each($('input[type="checkbox"]'), (key,value)=> {
              if($(value).parent().text().toLowerCase().includes 
                  ($("#search").val().toLowerCase())){
                     $(value).parent().show()
               }else{ 
                    $(value).parent().hide();
             }    
           });
         })
        })

I hope it will help you!