... <div id="container1"> <input type="checkbox" value="1" /> a <input type="checkbox" value="2" /> b <input type="checkbox" value="3" /> c <input type="checkbox" value="4" /> d <input type="checkbox" value="5" /> e <input type="checkbox" value="6" /> f </div> <div id="container2"> <input type="checkbox" value="11" /> a1 <input type="checkbox" value="12" /> b1 <input type="checkbox" value="13" /> c1 <input type="checkbox" value="14" /> d1 <input type="checkbox" value="15" /> e1 <input type="checkbox" value="16" /> f1 </div> <input id="mybutton" type="button" value="click me" /> ...
container1 |
---|
a b c d e f |
container2 |
---|
a1 b1 c1 d1 e1 f1 |
result
Now what I want is, whenever I click the button I want to retrieve all the values from the checked checkboxes. This is pretty easy in JQuery. Here's how my JS will look like
... $("#mybutton").click( function() { var myarray = []; $('input:checkbox:checked').each( function() { myarray.push($(this).val()); }); alert(myarray.join(', ')); } ); ...What if I want it only from the first <div>? I just need to pass context to the selector
... $("#mybutton").click( function() { var myarray = []; // passing container1 as context to selector $('input:checkbox:checked', '#container1').each( function() { myarray.push($(this).val()); }); alert(myarray.join(', ')); } ); ...JQuery makes my life a lot easier :).
No comments:
Post a Comment