Tag Helpers

Unobtrusive Client Side Validation in ASP.NET Core

In the tutorial, we will learn how to perform client-side validation using Javascript. We learnt how to perform server-side model validation in the previous tutorial. The Unobtrusive client- side validation in ASP.NET Cores uses the same validation attribution that used by the Model Validator. We will learn all these in this tutorial.

Validation Tag Helpers in ASP.NET Core

The ASP.NET provides validation related tag helpers which display the validation messages to the user. We learned how server-side model validation works in the previous tutorial. The Model binder binds and validates the data received over the HTTP Request. It then creates the ModelState object, which contains the validation messages generated by the Model Binder. The Validation Tag helpers generate the HTML element to display these messages in the view.

Form Tag Helper in ASP.NET Core

The Form Tag Helper targets the HTML form element and generates the action URL & action method attributes. It uses the various server-side attributes like asp-controller, asp-action, asp-route- etc to generate the form element in the view

Label Tag Helper ASP.NET Core

The label Tag Helper generates the appropriate

Input Tag Helper ASP.NET Core

The Input Tag Helper generates the appropriate <input> HTML element for the model property. The model property is bound using the asp-for attribute.  The input tag helper generates the appropriate HTML type, name & id attribute based on the Property data type & data annotations applied to the ViewModel. The ViewModel must be strongly typed to the View. It also emits the Validation related attributes, which helps in unobtrusive client-side validation. The asp-format attributes help in generating the properly formatted input elements.

Scroll to Top