Cannot get javascript working to check checkbox value

Question

My scenario is quite simple. I have a few checkboxes and I want to check whether they are checked or not.

Now I'm using the following:

        @Html.CheckBox("chkColour")<br />
        <input type="checkbox" name="chkColourCoding" value="Colour Coding" />Colour coding<br />
        <input type="checkbox" name="chkDoggyBars" value="Doggy Bars" />Doggy bars<br />
        <input type="checkbox" name="chkLadderRacks" value="Ladder Racks" />Ladder racks<br />
        <input type="checkbox" name="chkCabSliders" value="Cab Sliders" />Cab sliders<br />
        <input type="checkbox" name="chkBrakeLights" value="Brake Lights" />Brake Lights<br />
        <input type="checkbox" name="chkInteriorLights" value="Interior Lights" />Interior Lights<br />
        <input type="checkbox" name="chkRubberising" value="Rubberising" />Rubberising<br />
        <input type="checkbox" name="chkRoofRacks" value="Roof Racks" />Roof racks<br />

Now I googled almost two hours and I do not want to waste any more time on this. I've tried everything from

 var check = document.getElementById('chkColourCoding');
 if (check.checked)
 {}

to

 if($("#chkColourCoding").prop('checked'))
 {}

and also

 if($('.chkColourCoding').is(':checked'))
 {}

Can someone please explain to me what is the difference and suggest why something why this is not working? Do I need to do some referencing to use jQuery

Satya · Accepted Answer · 2014-09-04 07:06:14Z

1

you are looking for id and you have not assigned the id to your checkbox. change this line

<input type="checkbox" name="chkColourCoding" value="Colour Coding" />

to

<input type="checkbox" name="chkColourCoding" value="Colour Coding" id="chkColourCoding" />

and your javascript will rock.

answered Sep 4, 2014 at 7:06

Satya

8,9016 gold badges41 silver badges57 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Xlander · Accepted Answer · 2014-09-04 07:08:01Z

1

if($("#chkColourCoding").prop('checked')){}

What you're doing is getting a DOM element with id=chkColourCoding but it does not exist.

You can either add ids to your checkboxes or use name="theName".

if($('input[name="chkColourCoding"').is(':checked')){
  //your function
}

answered Sep 4, 2014 at 7:08

Xlander

1,33112 silver badges24 bronze badges

1 Comment

Ruvo Over a year ago

Lol...Rookie mistake. Thanks for the help!

Brijesh · Accepted Answer · 2014-09-04 07:08:32Z

You have missed to add id

see below working code...

@Html.CheckBox("chkColour")<br />
        <input type="checkbox" id="chkColourCoding" checked
         name="chkColourCoding" value="Colour Coding" />Colour coding<br />
        <input type="checkbox" name="chkDoggyBars" value="Doggy Bars" />Doggy bars<br />
        <input type="checkbox" name="chkLadderRacks" value="Ladder Racks" />Ladder racks<br />
        <input type="checkbox" name="chkCabSliders" value="Cab Sliders" />Cab sliders<br />
        <input type="checkbox" name="chkBrakeLights" value="Brake Lights" />Brake Lights<br />
        <input type="checkbox" name="chkInteriorLights" value="Interior Lights" />Interior Lights<br />
        <input type="checkbox" name="chkRubberising" value="Rubberising" />Rubberising<br />
        <input type="checkbox" name="chkRoofRacks" value="Roof Racks" />Roof racks<br />     


        <script language="javascript">
        var check = document.getElementById('chkColourCoding');
 if (check.checked)
 {
     alert("Checked");
 }
 else
 {
      alert("Not Checked");
 }


        </script>

Ramanand Potdar · Accepted Answer · 2014-09-04 10:19:32Z

0

inside Views

<div>
<input type="checkbox" class="checkbox" name="checkbox" />
</div>

Inside Script

//check value of

var v = $('.checkbox').is(':checked')
        if (v == true)
            alert('true');
        else
            alert('false');

answered Sep 4, 2014 at 10:19

Ramanand Potdar

311 silver badge8 bronze badges

Collectives™ on Stack Overflow

Cannot get javascript working to check checkbox value

4 Answers 4

Comments

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related