Search results

Getting Started

This section briefly explains about how to include a simple MaskedTextBox in your ASP.NET MVC application. You can refer ASP.NET MVC Getting Started documentation page for introduction part part of the system requirements and configure the common specifications.

Adding component to the Application

MaskedTextBox component can be rendered by using the EJS().MaskedTextBox() tag helper in ASP.NET MVC application. Add the below simple code to your index.cshtml page which is available within the Views/Home folder, to initialize the MaskedTextBox.

The following example shows a basic MaskedTextBox component.

razor
gettingstarted.cs
@section ControlsSection{

@Html.EJS().MaskedTextBox("mask1").Placeholder("MaskedTextBox").Render()

}
public ActionResult Demo()
{
    return View();
}

Set the mask

You can set the mask to the MaskedTextBox to validate the user input by using the mask property. To know more about the usage of mask and configuration, refer to this link.

The following example demonstrates the usage of mask element 0 that allows any single digit from 0 to 9.

razor
mask.cs
@section ControlsSection{

@Html.EJS().MaskedTextBox("mask1").Mask("000-000-0000").Placeholder("MaskedTextBox").FloatLabelType(FloatLabelType.Always).Render()

}
public ActionResult Mask()
{
    return View();
}

Output be like the below.

MaskedTextBox Sample

See Also