HTML helpers in MVC

HTML Helper methods are predefined methods in ASP.Net MVC to work with HTML forms.
HTML helper methods generate specific HTML tags on browser.

In this blog, we will see HTML Helpers in details.


For eg - HTML helper @Html.TextBoxFor(model=>model.ProductName) output is <input type="text" name="ProductName">

Note - ProductName is a property in our Model.

Similarly for TextBoxArea, @Html.TextBoxAreaFor(model=>model.ProductDescription)

@Html.BeginForm() is rendered as <form> </form>

For Textbox, you may either use @Html.TextBox or @Html.TextBoxFor.
@Html.TextBoxFor is strongly typed HTMLHelper


You may use traditional HTML tags that will not cause any issue.
But, HTML helpers method make it easy and it is directly linked with our modal class.

Below are the few HTML helpers that I have used in my recent MVC application.


HTML Helper
For HTML inputs
Html.TextBoxFor
Textbox
Html.TextAreaFor
TextArea
Html.RadioButtonFor
Radio button
Html.DropDownListFor
Dropdown
Html.CheckBoxFor
Checkbox


A basic form created with the help of HTML helper methods.

<div class="form-group">
                                    @Html.Label("Product/Service or anything")
                                    @Html.TextBoxFor(model => model.ReviewFor, new { placeholder = "Example: iPhone 7, Dell Laptop, Samsung TV" })
                                    @Html.ValidationMessageFor(model => model.ReviewFor, ""new { @class = "text-danger" })

                                </div>
                                <div class="form-group">
                                    @Html.Label("Review Title")
                                    @Html.TextBoxFor(model => model.ReviewTitle, new { placeholder = "Example: iPhone 7 is amazing. I love this product" })
                                    @Html.ValidationMessageFor(model => model.ReviewTitle, ""new { @class = "text-danger" })
                                </div>

                                <div class="form-group">
                                    @Html.Label("Product/Service Brand")
                                    @Html.TextBoxFor(model => model.ProductBrand, new{ placeholder = "Example: Apple" })
                                    @Html.ValidationMessageFor(model => model.ProductBrand, ""new { @class = "text-danger" })
                                </div>


Other blogs on MVC -



Comments

Popular

What's new in C# 6.0 language - All new features of C# 6.0 for developers

SharePoint Interview Questions and Answers