how to create view using html helpers in mvc

11/25/2016 12:00:00 AM

HtmlHelper in ASP.NET MVC

Introduce: An html helper is a method that is used to render html content in a view.html helper are completed as extension method. “@Html” is a HtmlHelper and “ActionLink” is a one extension method for HtmlHelper. HtmlHelper decrease your coding.

List of HtmlHelper methods and Html content :



                         Html Contant


<a href=”Home/Index”>Index</a>


<label for=”Username”>Username</label>


<Index type=”text” name=”Username” id=”Username” value=””/>


<input type=”Password” name=”Password” id=”Password”>


<input type=”radio” value=”Male” name=”Gender” id=”Gender”/>

@Html.DropDownList(“profession”,new SelectList(ViewBag.profession, “value”,”text”)) 

<select name=”profession” id=”profession”>

          <option value=”student”>student</option>

          <option value=”Employed”> Employed</option>



<textarea name=”message” id=”message”></textarea>


<input type=”checkbox” name=”IAgree” id=”IAgree/>”


<Input type=”hidden” name=”UserId” id=”UserId” value=””>

create view using html helpers :

Step : 1

  • Open Visual studio
  • Click on “File”>New>Project>Visual c#>Web> then provide your project name> then select “ok”> then click “MVC”>ok.
  • Create new controller “controller name like as HtmlHelper” 

Add view  “view name like as Index”

Step : 2

       Example :1 write simple Html code for inputbox.

  <Index type=”text” name=”Username” id=”Username” value=””/>
  • write code use htmlhelper for inputbox.
  • run this project you see same inputbox, Why are the benefits of HtmlHelpe? HtmlHelpe has a lot of advantages, one of them reduces your coding.

       Example :2 Now create a RegisterForm use htmlhelper.



<br /><br /><br />
                @Html.RadioButton("Gender","Male") Male
                @Html.RadioButton("Gender", "Female") Female
                @Html.DropDownList("Profession",new SelectList(ViewBag.Profession,"Text","Value"))
                @Html.Label("I Agree")
                @Html.Label("About yourself")

           step:2 Write this code in your Controller for DropDownList [if you don't understand it,you can see the video].


public ActionResult Index()
            List<SelectListItem> Item = new List<SelectListItem>();
            Item.Add(new SelectListItem { Text = "Student", Value = "Student", Selected = false });
            Item.Add(new SelectListItem { Text = "Employee", Value = "Employee", Selected = false });
            ViewBag.Profession = Item;
            return View();

Now run the project.

About Teacher

Reza Karim

Software Engineer

More about him