MVC 3 checkbox always returns true, even if unchecked

Question

I have the following code

@foreach (var item in Model.Defaults) { <tr class="CertainCategory"> <td> @item.Item1 </td> <td> @Html.CheckBoxFor(c => c.Use) @Html.Hidden("guid", guid.guid.ToString()) </td> </tr> }

I'm trying to use AJAX to submit form values to the controller method. My problem is that the value of the checkbox is always sent as true.

$('.CropUsageItem').each(function () { var guid = $(this).find("#guid").val(); var chk = $(this).find("#use").val(); var data = { guid: guid, chk: chk }; $.ajax({ async: false, type: "POST", url: "DefaultValues/SaveDefault", data: data }); });

I have searched StackOverflow with similar results but none of them fully apply to my scenario. How can I send the correct value?

Your saying var chk = $(this).find("#use").val(); chk equals true regardless of the checked status of #use ? — asawyer
– asawyer, Commented Oct 6, 2011 at 12:15
Yes, even if its unchecked it still posts true to the action method — Heinrich Walkenshaw
– Heinrich Walkenshaw, Commented Oct 6, 2011 at 12:17

Nicholas Murray · Accepted Answer · 2011-10-06 12:30:35Z

54

You can use the following verify if a checkbox is checked.

var chk = $('#use').attr('checked');

or

var chk = $('#use').is(':checked');

edited Oct 6, 2011 at 12:30

answered Oct 6, 2011 at 12:16

Nicholas Murray

13.5k14 gold badges69 silver badges85 bronze badges

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

5 Comments

Heinrich Walkenshaw Over a year ago

Brilliant! the second option does exactly what i was after.

Nicholas Murray Over a year ago

@Heinrich - Glad to help, you may wish to use fiddler2 to help you debug these sort of issues.

Michael Brennt Over a year ago

first option returns always 'checked', no matter what :)

akd Over a year ago

second option is the answer for me

Michael Brennt Over a year ago

in my case first option is always undefined, but second works like a charm

Simon Halsey · Accepted Answer · 2011-10-06 14:38:28Z

.val() returns the contents of the value attribute. as it probably is non-null that equates to true.

Also check your casing. JavaScript, css & therefor also jQuery are case sensitive.

xr280xr · Accepted Answer · 2022-01-27 21:23:07Z

Like Simon said, .val() returns the value attribute of the checkbox, which can be any value you want. But more specifically, it returns the value property of the DOM object, which is initialized by the attribute. MVC seems to set the value to "true" by default, which seems pretty meaningless to me. But in some cases you might want want to set it to an ID or some other meaningful value for the checked option as this thread points out.

Nicholas provided one good way of getting whether the checkbox is checked above. Check and uncheck the checkbox on this jsfiddle for an example of the various approaches and their results:

JQuery Checkbox Checked

Summary of fiddle:

$("#use").val(); //Returns the value. Not related to checked state. $("#use").attr("checked") //Returns the checked attribute value. Does not change with checked state. $("#use").prop("checked") //Returns boolean checked state. $("#use")[0].checked //Returns boolean checked state. $("#use").is(":checked") //Returns boolean checked state.

Notice the results of .val and .attr do not change. That is because the val property is not dependent on the checked state, and the actual checked attribute in the markup does not update when the checkbox changes. Only the property on the DOM object behind the scenes, which is what the last three methods access.

See jQuery's API documentation on .prop for more info about this.

Michael Day · Accepted Answer · 2015-05-01 21:31:04Z

0

var chk = $('#use').checked;

worked for me

answered May 1, 2015 at 21:31

Michael Day

111 silver badge4 bronze badges

Collectives™ on Stack Overflow

MVC 3 checkbox always returns true, even if unchecked

4 Answers 4

5 Comments

Comments

Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

5 Comments

Comments

Comments

Comments

Linked

Related