+- CodeIgniter Forums (https://forum.codeigniter.com)
+-- Forum: Archived Discussions (https://forum.codeigniter.com/forumdisplay.php?fid=20)
+--- Forum: Archived Development & Programming (https://forum.codeigniter.com/forumdisplay.php?fid=23)
+--- Thread: jQuery: check/uncheck all checkboxes with specific value (/showthread.php?tid=15672)
jQuery: check/uncheck all checkboxes with specific value - El Forum - 02-11-2009
[eluser]codex[/eluser]
Ok, I have this
Code:
onClick="$('input[@type=checkbox]').attr('checked', 'checked')"But how do you add a specific value? I'd like it to say 'check all checkboxes with value 5'.
jQuery: check/uncheck all checkboxes with specific value - El Forum - 02-11-2009
[eluser]bitist[/eluser]
Code:
<script language="JavaScript" type="text/javascript" src="jquery.js"></script>
<script language="Javascript" type="text/javascript">
$(document).ready(function() {
$("#toggle5").click(function(event){
$('input[@type=checkbox]').each( function() {
if($(this).val()==5)
this.checked = !this.checked;
});
});
});
</script>
<a href="#" id="toggle5">Toggle 5ve</a>
<form method="post" action="" style="margin:0px">
<input type="checkbox" name="a" value="1" id="" />
<input type="checkbox" name="b" value="2" id="" />
<input type="checkbox" name="c" value="3" id="" />
<input type="checkbox" name="d" value="4" id="" />
<input type="checkbox" name="e" value="5" id="" />
<input type="checkbox" name="f" value="5" id="" />
</form>This will toggle checkboxes which have value=5.
jQuery: check/uncheck all checkboxes with specific value - El Forum - 02-11-2009
[eluser]codex[/eluser]
Thanks! That does the trick.
jQuery: check/uncheck all checkboxes with specific value - El Forum - 02-11-2009
[eluser]Nick Husher[/eluser]
Note that the @property=value syntax has been depricated since jQuery 1.2. From the documentation: "Note: In jQuery 1.3 [@attr] style selectors were removed (they were previously deprecated in jQuery 1.2). Simply remove the '@' symbol from your selectors in order to make them work again."
This is very similar, but lets you control what values you check and uncheck without rewriting your function:
Code:
jQuery(document).ready(function() {
jQuery('.toggle').click(function(e) {
var par = (/parent-class-(\S+)/).exec(e.target.className)[1];
var val = (/toggle-value-(\S+)/).exec(e.target.className)[1];
par = (par === null) ? par = '' : '.'+par;
val = (val === null) ? val = '' : '[value="'+val+'"]';
jQuery(par + ' input[type="checkbox"]' + val).each(function() {
this.checked = !this.checked;
});
});
});Your toggle button would look something like this:
Code:
<div class="toggle toggle-value-5 parent-class-checkbox-form">Toggle all "fives" in the "checkbox form"</div>