I have the following checkboxes in an HTML form.
<ul id="selection">
<span><label>First<br><input type="checkbox" name="First"></label></span>
<span><label>Second<br><input type="checkbox" name="Second"></label></span>
<span><label>Third<br><input type="checkbox" name="Third"></label></span>
<span><label>Fourth<br><input type="checkbox" name="Fourth"></label></span>
<span><label>Fifth<br><input type="checkbox" name="Fifth"></label></span>
</ul>
I'm trying to create two buttons. One that would select the first two and one that would select all of them.
I managed to select all of them with one button using this:
<input type="button" class="check btn" onClick="select(this)" value="Select All"/>
<script>
$('.check:button').click(function(){
var checked = !$(this).data('checked');
$('input:checkbox').prop('checked', checked);
$(this).val(checked ? 'uncheck all' : 'Select' )
$(this).data('checked', checked);
});
</script>
But I can't seem to get the two buttons working.
My JavaScript knowledge is pretty limited and been searching for days, unsuccessfully for a solution that works.
Can please someone help? a detailed explanation would be awesome.
Aucun commentaire:
Enregistrer un commentaire