Yit Club
Yit Club

Reputation: 57

How to check checkboxes which are not hidden by jquery

I have these checkboxes

    <input type='checkbox' class="catagory region-1"/> 
        <ul>
            <li>1
                <input type='checkbox' class="catagory region-1" />
                <ul>
                    <li>2
                        <input type='checkbox' class="catagory region-1" />
                    </li>
                </ul>
            </li>
           <li>1
                <input type='checkbox' class="catagory region-1" />
                <ul>
                    <li>2
                        <input type='checkbox' class="catagory region-1" />
                    </li>
                    <li>2
                        <input type='checkbox' class="catagory region-2" />
                    </li>
                    <li>2
                        <input type='checkbox' class="catagory region-2" />
                    </li>
                </ul>
            </li>
        </ul>

   

$(function () {
    $("input[type='checkbox']").change(function () {
        $(this).siblings('ul')
            .find("input[type='checkbox']")
            .prop('checked', this.checked);
    });
});
li ul {
    padding-left: 25px;
    border: none;
    display:block;
}
ul {
    border: 2px solid blue;
    padding: 5px;
    margin:5px;
    display:inline-block;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

I already written a jquery function to filter checkbox by catagory with the class filter function, The filtered one will be show and the others will be hidden. So I want to write a function to check all checkboxes which are not currently hidden after that.

Upvotes: 0

Views: 54

Answers (2)

freshbm
freshbm

Reputation: 5622

Call this after filtering your checkboxes:

$('input:checkbox:visible').prop('checked', true);

This will check all visible checkboxes.

You can add Attribute Equals selectors:

$("input:checkbox:visible[thetype='customcheck']").prop('checked', true);

Upvotes: 1

Pancake
Pancake

Reputation: 865

If I understand your question correctly, this should do the trick:

$("input:checkbox").filter(":visible").prop('checked', true);

Upvotes: 0

Related Questions