paz
paz

Reputation: 1245

Select all checkboxes using jQuery and select option

I have the following code:

<select id="deloptions">
<option value="none">Select none</option>
<option value="all">Select all</option>
</select>

I'm trying to check all theck and uncheck all the checkboxes from a table which is placed after this select. The checkboxes are placed in the 1st collumn of the table. They all have "delme" class. I've tried everything but it doesn't seem to work... Here is my current code:

$('#deloptions').change(function(){ 
var value = $(this).val();
if (value == 'all') {
    $('input:checkbox').prop('checked', true);
    } else {
    $('input:checkbox').prop('checked', false);
    }
});

I've tried using their class too but no success... like:

$('.delme').prop('checked', false);

Trying reaching for the table didn't work either... so i'm kindda stucked.

EDITED:

<table>
<tr>
<th></th>
<th>Title</th>
<th>Content</th>
<th>Date Added</th>
<th>Actions</th>
</tr>

<tr id="37">
<td><input type="checkbox" class="delme" id="37"></td>
<td>Good news!</td>
<td>This is a message!</td>
<td>2013-07-22</td>
<td>Here is a button</td>
</tr>
</table>

Upvotes: 0

Views: 1061

Answers (5)

loresIpsos
loresIpsos

Reputation: 337

Try:

$('#deloptions').change(function(){ 
 var value = $(this).val();
 if (value == 'all') {
   $('input').attr('checked', 'checked');
 } else {
   $('input:checkbox').prop('checked', 'no');
 }
});

Upvotes: 1

Manish Sharma
Manish Sharma

Reputation: 2426

try this code.

$(function(){

// add multiple select / deselect functionality
$("#selectall").click(function () {
      $('.case').attr('checked', this.checked);
});

// if all checkbox are selected, check the selectall checkbox
// and viceversa
$(".case").click(function(){

    if($(".case").length == $(".case:checked").length) {
        $("#selectall").attr("checked", "checked");
    } else {
        $("#selectall").removeAttr("checked");
    }

});
});

Upvotes: 0

Manoj Yadav
Manoj Yadav

Reputation: 6612

You may have not added jQuery reference as your code is working fine

jsFiddle

Upvotes: 0

Amit
Amit

Reputation: 15387

Try this

 $(function(){
    $("#deloptions").change(function(){
       if($("#deloptions  option:selected").val()=="all")
       {
              $('input[type="checkbox"]').prop("checked", false);
       }
       else
       {
              $('input[type="checkbox"]').prop("checked", true);
       }
    });
 })

Upvotes: 0

Sandiip Patil
Sandiip Patil

Reputation: 446

Try this

$('input[type="checkbox"]').prop("checked", false);

Upvotes: 0

Related Questions