- Create a Hidden Field in ASP.NET MVC
- Html.HiddenFor()
- Html.Hidden()
- Html Helper. Hidden Method
- Overloads
- Hidden(String, Object, Object)
- Parameters
- Returns
- Exceptions
- Applies to
- Hidden(String, Object, IDictionary)
- Parameters
- Returns
- Html.HiddenFor Example in ASP.NET MVC
- What is the purpose of using Hidden() Field in Html?
- Programming Example
- Html.Hidden Example
- Html.Hidden - Basic Type
- Html.HiddenFor - Strongly Type
- Html.Hidden Example
- Html.Hidden - Basic Type
- Html.HiddenFor - Strongly Type
- Summary
Create a Hidden Field in ASP.NET MVC
Learn how to generate hidden field using the HtmlHelper in razor view in this section.
The HtmlHelper class includes two extension methods to generate a hidden field element in a razor view: HiddenFor() and Hidden() .
We will use the following Student model class throughout this article.
public class Student < public int StudentId < get; set; >public string StudentName < get; set; >>
Html.HiddenFor()
The Html.HiddenFor extension method is a strongly typed extension method generates a hidden input element for the model property specified using a lambda expression.
Visit docs.microsoft.com to know all the overloads of HiddenFor() method.
@model Student @Html.HiddenFor(m => m.StudentId)
input data-val="true" data-val-number="The field StudentId must be a number." data-val-required="The StudentId field is required." id="StudentId" name="StudentId" type="hidden" value="" />
In the above example, the first parameter in HiddenFor() method is a lambda expression that specifies the model property to be bind with the hidden field. We have specified the StudentId property in the above example. So, it generates an input text element with id & name set to the property name. The value attribute will be set to the value of the StudentId property.
Please notice that it has created data- HTML5 attribute, which is used for the validation in ASP.NET MVC.
Html.Hidden()
The Html.Hidden() method generates a input hidden field element with specified name, value and html attributes.
@model Student @Html.Hidden("StudentId")
Html Helper. Hidden Method
Some information relates to prerelease product that may be substantially modified before it’s released. Microsoft makes no warranties, express or implied, with respect to the information provided here.
Overloads
Returns an HTML hidden control that has the specified name, value, and custom attributes defined by an attribute object.
Returns an HTML hidden control that has the specified name, value, and custom attributes defined by an attribute dictionary.
Returns an HTML hidden control that has the specified name.
Returns an HTML hidden control that has the specified name and value.
Hidden(String, Object, Object)
Returns an HTML hidden control that has the specified name, value, and custom attributes defined by an attribute object.
public System.Web.IHtmlString Hidden (string name, object value, object htmlAttributes);
member this.Hidden : string * obj * obj -> System.Web.IHtmlString
Public Function Hidden (name As String, value As Object, htmlAttributes As Object) As IHtmlString
Parameters
The value to assign to the name attribute of the HTML control element.
The value to assign to the value attribute of the element.
An object that contains custom attributes for the element. The attribute names and values are retrieved through reflection by examining the properties of the object.
Returns
The HTML markup that represents the hidden control.
Exceptions
Applies to
Hidden(String, Object, IDictionary)
Returns an HTML hidden control that has the specified name, value, and custom attributes defined by an attribute dictionary.
public System.Web.IHtmlString Hidden (string name, object value, System.Collections.Generic.IDictionary htmlAttributes);
member this.Hidden : string * obj * System.Collections.Generic.IDictionary -> System.Web.IHtmlString
Public Function Hidden (name As String, value As Object, htmlAttributes As IDictionary(Of String, Object)) As IHtmlString
Parameters
The value to assign to the name attribute of the HTML control element.
The value to assign to the value attribute of the element.
The names and values of custom attributes for the element.
Returns
The HTML markup that represents the hidden control.
Html.HiddenFor Example in ASP.NET MVC
Html.Hidden() field is same as other input control like Html.TextBox but there are some special features in Html.Hidden that is listed below:
- It is hidden field, means the control will not be visible to user.
- User cannot interact with this control.
- This control is used for storing and sending extra information to server or next page.
- It sends additional information that user doesn’t know or isn’t interested in.
- It maintains data even in Postback.
- The Hidden Field data can be read by client side script like Java Script and JQuery.
What is the purpose of using Hidden() Field in Html?
You created a form, and asked users to fill some information. In the behind, you also want to collect some user information and send those information to server when user click submit button. These information might be:
1. IP address of User’s Machine
2. Which browser user is using
3. Which Operating system user is using; Android, iOS, Linux or Windows 7, etc
4. Security Token
5. Submission Date
6. Etc.
So, when user will fill the form, meanwhile you can collect all the above information and keep them into a hidden field.
Html.Hidden() is a basic typed helper method or loosely typed helper method, that isn’t bounded with any model. It contains 2 parameters; Hidden Field Name and Hidden Field Value.
MvcHtmlString Html.Hidden(string name, object value, object htmlAttributes)
@Html.Hidden("Hidden_Field_Name","Value")
Html.HiddenFor() is a strongly typed method that is bounded with model class. It communicates and send/receive value to model class properties. Generally it contains 2 parameters; Hidden Field Name which is a model property and Value for Hidden Field.
MvcHtmlString Html.HiddenFor(Expression> expression)
@Html.HiddenFor(m => m.UserId, new < Value = "1" >)
Programming Example
Here, I am giving a basic Html.Hidden and Html.HiddenFor example. In this following example, I have tried to explain following thing:
1. Creating and Defining Basic and Strongly typed hidden field.
2. Assigning Value to hidden field using Controller.
3. Displaying Hidden Field Value in View Page.
namespace HtmlHelperDemo.Models < public class UserModel < public int UserId < get; set; >public string UserName < get; set; >> >
@using HtmlHelperDemo.Models @model UserModelHtml.Hidden Example
@using (Html.BeginForm()) < //Basic Hidden Field @Html.Hidden("BasicHiddenName", "Steven Clark") //Strongly Typed Hidden Field @Html.HiddenFor(m =>m.UserId, new < Value = "1" >)
@Html.HiddenFor(m=>m.UserName, new < Value = "Steven Clark">) >Html.Hidden - Basic Type
Value: @ViewBag.basicname
Html.HiddenFor - Strongly Type
ID: @ViewBag.id
Name: @ViewBag.name
using System.Web.Mvc; using HtmlHelperDemo.Models; namespace HtmlHelperDemo.Controllers < public class HomeController : Controller < public ActionResult Index() < return View(); >[HttpPost] public ActionResult Index(FormCollection fc, UserModel um) < ViewBag.basicname = fc["BasicHiddenName"]; ViewBag.id = um.UserId; ViewBag.name = um.UserName; return View(um); >> >
Html Output:
In order to see the output, click on submit button and then go to source page by pressing Ctrl + U in your browser.
namespace HtmlHelperDemo.Models < public class UserModel < public int UserId < get; set; >public string UserName < get; set; >> >
@using HtmlHelperDemo.Models @model UserModelHtml.Hidden Example
@using (Html.BeginForm()) < //Basic Hidden Field @Html.Hidden("BasicHiddenName", null, new < @id = "BasicHiddenName" >) //Strongly Typed Hidden Field @Html.HiddenFor(m => m.UserId, new < >)
@Html.HiddenFor(m=>m.UserName, new < >) >Html.Hidden - Basic Type
Value: @ViewBag.basicname
Html.HiddenFor - Strongly Type
ID: @ViewBag.id
Name: @ViewBag.name
using System.Web.Mvc; using HtmlHelperDemo.Models; namespace HtmlHelperDemo.Controllers < public class HomeController : Controller < public ActionResult Index() [HttpPost] public ActionResult Index(FormCollection fc, UserModel um) < ViewBag.basicname = fc["BasicHiddenName"]; ViewBag.id = um.UserId; ViewBag.name = um.UserName; return View(um); >> >
Summary
In this chapter, I have tried to teach you how to use Html.Hidden Field in ASP.Net MVC 5. It is pretty easy to learn this control with the help of mentioned programming example in this article.