CODEWITHSUNDEEP
jqueryasp.net-mvchtml
Ruvo
Ruvo

Reputation: 727

Cannot get javascript working to check checkbox value

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

Upvotes: 0

Views: 838

Answers (4)

Ramanand Potdar
Ramanand Potdar

Reputation: 31

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');

Upvotes: 0

Brijesh
Brijesh

Reputation: 86

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>

Upvotes: 1

Xlander
Xlander

Reputation: 1331

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
}

Upvotes: 1

Satya
Satya

Reputation: 8881

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.

Upvotes: 1

Related Questions