difference in input type=Checkbox, @HTML.CheckBox and @HTML.CheckBoxFor?

Question

I m new to MVC and confused what is difference in <Input type="Checkbox">, @HTML.CheckBox and @HTML.CheckBoxFor.

Can you please guide why two helpers are provided for same thing ? In which situation which one should be used ?

Thanks

Edit: Added Input type=checkbox

CheckBoxFor takes an object as an argument, and creates a checkbox bound to that object data — Claies
– Claies, Commented Jan 3, 2014 at 3:58

techBeginner · Accepted Answer · 2014-01-03 04:40:14Z

9

<Input type="Checkbox"> is Html markup for a checkbox and @Html.CheckBox & @HTML.CheckBoxFor are Html Helpers for Razor view engine..

suppose your viewmodel has a property Person.HadDinner, then usually for model binding to work properly you will have to name the checkbox Person.HadDinner and id as Person_HadDinner..

you can use @Html.CheckBox like

@HTML.CheckBox("Person.HadDinner", Model.Person.HadDinner)

but if you are using @HTML.CheckBoxFor, it will be strongly typed..

@HTML.CheckBoxFor(x => x.Person.HadDinner)

in both the cases, final output markup will be

<input type="checkbox" id="Person_HadDinner" name="Person.HadDinner">

answered Jan 3, 2014 at 4:40

techBeginner

3,86813 gold badges45 silver badges61 bronze badges

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

Comments

Nico · Accepted Answer · 2014-01-03 04:29:39Z

2

The CheckboxFor (MSDN)

Returns a check box input element for each property in the object that is represented by an expression.

This means a checkbox element is created for each property in the expression provided. Where as Checkbox (MSDN)

Returns a check box input element by using the specified HTML helper and the name of the form field.

This creates a simple Checkbox element with the (optional) attributes provided.

Typically when referencing a property of an object (or the View Model) the most desired technique is to use CheckboxFor as the checkbox will be formatted correctly against your model.

Hope this helps.

EDIT: Response to OP Changes.

Both the CheckboxFor and Checkbox generate standard HTML output such as below.

@Html.CheckboxFor(m => m.SomeProperty)

<input type="checkbox" name="SomeProperty" id="SomeProperty" />

@Html.Checkbox("SomeProperty")

<input type="checkbox" name="SomeProperty" id="SomeProperty" />

The helper methods simply generate the HTML required to meet the expressions and attributes defined in the helpers.

Additionally, you dont have to use the helpers. You can write your HTML elements directly as needed.

edited Jan 3, 2014 at 4:29

answered Jan 3, 2014 at 4:13

Nico

12.7k5 gold badges46 silver badges62 bronze badges

1 Comment

Toubi Over a year ago

thanks. Can you please see my edit and tell about Input type=checkbox as well ? Thanks

Collectives™ on Stack Overflow

difference in input type=Checkbox, @HTML.CheckBox and @HTML.CheckBoxFor?

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related