How do I search multiple Checkbox fields?

Question

How do I search multiple Checkbox fields?

Asked 10 years, 2 months ago

Viewed 44 times

2

I have several Checkbox

<div class="checkbox">
   <label>
   <input type="checkbox" class="chkItem" name="Selected" value="1" /> A
   </label>
</div>
<div class="checkbox">
   <label>
   <input type="checkbox" class="chkItem" name="Selected" value="2" /> B
   </label>
</div>
<div class="checkbox">
   <label>
   <input type="checkbox" class="chkItem" name="Selected" value="3" /> C
   </label>
</div>

How do I create a "Search" search for the letter "C" for example and hide all other checkbox ?

I don’t understand what you really want to do

– Thallyson Dias

2014/09/12 at 16:50
@Thallysondias, I have many checkbox, I just wanted to make a filter with an input,for the user to fetch what he wants, leaving "Hide" all the others, and giving show only on what he sought

– Rod

2014/09/12 at 16:59
What is your goal? Click on checkbox C and hide others? Is clicking and searching for letters "C" in a text? Is it cursing all people on Facebook with names that contain the letter "C"? : Q. You can specify your question a little more?

– gabrielhof

2014/09/12 at 17:00
@gabrielhof explained in the above comment

– Rod

2014/09/12 at 17:01
Is it something like that? http://jsfiddle.net/h5z7zxod/

– gabrielhof

2014/09/12 at 17:13
@gabrielhof, thanks for the help but that’s not it, I have 100 Checkbox, like the above, I want to put an input text to search only the "C" for example

– Rod

2014/09/12 at 17:15

Show 1 more comment

1 answer

Browser other questions tagged jquery

You are not signed in. Login or sign up in order to post.

by Jader A. Wagner • **4,921** points · Answer 1 · 2014-09-12T17:15:54+00:00

I had a search like this here and it was easy to adapt in your html:

$("#search").bind("change keyup", function() {
    var search_str = $(this).val().toLowerCase();
    if (search_str != "") {
        $(".checkbox").hide();
        $(".checkbox").filter(function( index ) {
            return $( this ).text().toLowerCase().indexOf(search_str) != -1;
        }).show();
    } else {
        $(".checkbox").show();
    }
});

Functioning in the Jsfiddle