In this session of ASP.NET Core tutorial, we will discuss about Form Validation in ASP.NET Core and review Required Attribute and StringLength Attribute as well. Also, we will talk about one more HTML Helper which handle Validation Error Message and it is ValidationMessageFor. For validating a form, we need to modify the controller, Model or ViewModel. Also, we need to revise the View, based on the helper that we used there.
Required Attribute & StringLength Attribute
One of the pre requirement of form validation, is setting some set of conditions for the form that we need. For example, we can make a mandatory property, if the data of that property is critical for our operation. When we make a mandatory property, status of the model could be true just if fill that property. For making a mandatory property, we can decorate that property of the Model or ViewModel with Required Attribute.
Also, we can limit length of String property with StringLength attribute; If, we need to limit maximum character or even minimum characters of a property. Thus, we can decorate that property of the Model or ViewModel with the mentioned attribute.
Just bear in mind, these attributes needs System.ComponentModel.Dat namespace, thus we should add this namespace to the Model or ViewModel.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
public class CreateCostViewModel { public decimal Amount { get; set; } public DateTime Date { get; set; } [Required(ErrorMessage ="Comment is mandatory")] [StringLength(50,MinimumLength =5)] public string Comment { get; set; } public string Category { get; set; } public List<SelectListItem> Categories { get; set; } public List<string> SelectedCategories { get; set; } public int PaymentMethod { set; get; } public List<PaymentMethod> PaymentMethods { get; set; } public bool MakeFormClear { get; set; } } |
As you can see in above piece of code, Comment property is a mandatory property as it is decorated with Required Attribute. Also, user can fill this property with a string between 5 to 50 characters length.
Form Validation in ASP.NET Core
After setting required condition on Model or ViewModel same as above step, for Form Validation we need to modify the Controller. For this purpose, the Action Method should have one more method except HttpGet part. It could be HttpPost, HttpPut or HttpPatch, depends on the situation.
Then, we can use ModelState.IsValid in the HttpPost part of method to verify whether received data model is valid or not. This method return a Boolean result, If the result would be True, it means the form is valid otherwise it means one or more condition(s) is missed.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
[HttpPost] public IActionResult Edit(Cost Model) { if (ModelState.IsValid) { //Post Process } return View(Model); } |
As you can see, if Model Status would be valid, we can process the data, otherwise, method call the View again and passed the received data to the View for handling Validation Error Message.
Handling Validation Error Message with ValidationMessageFor
It depends on the code that we used in the View, we can use ValidationMessageFor Html Helper to handle the error message. On the other hand, if we made the View with EditorForModel, we don’t need to add any extra code for handling the error message. But, if we created the view with other Helpers same as TextBoxFor or DropDownListFor, we need to add ValidationMessageFor Html Helper to handle the error message.
Moreover, for binding this helper to the property, we can use Lambda expression same as other Html Helpers. Also, we can use Html Attribute parameter to apply styles or Classes to the helper.
|
1 2 3 4 5 6 7 |
@Html.LabelFor(m => m.Comment, new { @class = "form-lable" }) @Html.TextAreaFor(m => m.Comment, new { @class = "form-control" }) @Html.ValidationMessageFor(m=> m.Comment,"",new {style="color:red" }) |
Below code is a sample of ValidationMessageFor Html Helper that is bound to Comment Property with Lambda Expression and its color is changed with Html Attribute.
As you can see, in above piece of code, we add required namespace then we call the HTML Helper extension.
If you need more details, watch this session video. Also, for being updated about our coming sessions, follow us on Instagram, Facebook, Telegram or YouTube. Also you can have access to list of all sessions HERE.
You can download this Session Slides form HERE