Why does the CheckBox Html Helper render a hidden input field?

Question

I often use the built in CheckBox HtmlHelper as it allows me to easily specify the checked state of the element like this

@Html.CheckBox("Test",Model.IsChecked);

vs creating it on the view like so

@if(Model.IsChecked)
{
  <input id="test" type="checkbox" checked="checked" />
}
else
{
  <input id="test" type="checkbox"  />
}

However when inspecting the html generated by the helper i can see it renders this html.

<input id="Test" name="Test" type="checkbox" value="true" />
<input name="Test" type="hidden" value="false" />

I can't work out why there is a hidden field input as well, what is it used for?

Igor · Accepted Answer · 2014-10-24 16:05:42Z

3

Form data submitted by the browser does not include keys and values for unchecked checkboxes. Without the hidden field, there is no way for the server-side code to determine if the checkbox is present in the form and is unchecked or if it does not exist on the client at all.

Html.CheckBox creates hidden field with the same name as the name of the input with type="checkbox", therefore the submitted value is "true,false" for checked checkbox, and "false" for unchecked checkbox.

answered Oct 24, 2014 at 16:05

Igor

15.9k1 gold badge29 silver badges34 bronze badges

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

Collectives™ on Stack Overflow

Why does the CheckBox Html Helper render a hidden input field?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related