Reputation: 57
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
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
Reputation: 865
If I understand your question correctly, this should do the trick:
$("input:checkbox").filter(":visible").prop('checked', true);
Upvotes: 0