CODEWITHSUNDEEP
jquery
Seeker
Seeker

Reputation: 1927

Select All Checkboxes On Click using Jquery

I have following HTML:

<label><input type="checkbox" value="12" name="Cevent[]" /> Yoga</label>
<label><input type="checkbox" value="12" name="Cevent[]" /> Yoga 1</label>
<label><input type="checkbox" value="12" name="Cevent[]" /> Yoga 2</label>
<label><input type="checkbox" value="12" name="Cevent[]" /> Yoga 3</label>
<label><input type="checkbox" id="selectAllEventList" name="selectAllE"> Select All</label>

and Following Jquery:

$(document).ready(function (){

   $('#selectAllEventList').click (function () {
          $('input[name=Cevent[]]').each(function(){
          $(this).prop('checked', status);
          });

     });
 });

But i am getting Syntax error:

Error: Syntax error, unrecognized expression: [name=Cevent[]]

I think i am writing wrong Selector at input[name=Cevent[]] what is the problem how can i write it correctly because i must have to send it as a array so i have to write it as Cevent[].

Upvotes: 0

Views: 111

Answers (3)

James Allardice
James Allardice

Reputation: 166041

Quote the attribute value:

$('input[name="Cevent[]"]')

Update

I assume that your code is meant to check/uncheck all the Cevent[] checkboxes when the selectAllE checkbox is changed. If that's the case, you can shorten your code significantly, because most jQuery methods apply to every element in the matched set (there's no need to use .each()):

$(document).ready(function () {
    $('#selectAllEventList').click(function () {
        $('input[name="Cevent[]"]').prop('checked', this.checked);
    });
});​

Upvotes: 2

gaurang171
gaurang171

Reputation: 9090

Please try this

see Demo

JS

$('#selectAllEventList').click (function () {
          $('.chkbox').each(function(){
          $(this).prop('checked', true);
          });

     });

HTML 

<label><input type="checkbox" class="chkbox" value="12" name="Cevent[]" /> Yoga</label>
<label><input type="checkbox" class="chkbox" value="12" name="Cevent[]" /> Yoga 1</label>
<label><input type="checkbox" class="chkbox" value="12" name="Cevent[]" /> Yoga 2</label>
<label><input type="checkbox" class="chkbox" value="12" name="Cevent[]" /> Yoga 3</label>
<label><input type="checkbox" id="selectAllEventList" name="selectAllE"> Select All</label>

Upvotes: 0

Adil
Adil

Reputation: 148180

You can use \ to escape [,

Live Demo

$(document).ready(function (){

   $('#selectAllEventList').click (function () {
          $('input[name*=Cevent\\[]').each(function(){
              if( $('#selectAllEventList').is(':checked'))
                   $(this).prop('checked',true);
              else
                   $(this).prop('checked',false);
          });

     });
 });​

Upvotes: 0

Related Questions