How to enable the Unobtrusive Jquery validation for a form in MVC on page transfer ?
nobtrusive jquery validation for form
In MVC, form validation is achieved by using its built-in jquery unobtrusive validation. The form validation does not work when a page is transferred via the Ajax request. You can enable the validation in the viewtransfer event. To achieve this, refer to the following steps.
- Create a model file to the application. This consists of jquery validation rules. You can refer to the following code example.
Sample.cs
public class Sample { [Required] public string Name { get; set; } [Required] [EmailAddress] public string Email { get; set; } } |
- Create the form with unobtrusive error message. Refer to the following code example.
Index.cshtml
<form> @Html.LabelFor(model => model.Name) @Html.TextBoxFor(model => model.Name) @Html.ValidationMessageFor(model => model.Name) <br /> @Html.LabelFor(model => model.Email) @Html.TextBoxFor(model => model.Email) @Html.ValidationMessageFor(model => model.Email) <br /> <input type="submit" value="Submit" /> </form> |
- To enable form validation after the Ajax page transfer, add the following script code to the active page. This recalibrates all the validators of the form elements when content is added dynamically.
Script
<script> $(document).bind("viewtransfer", function () { $('form').removeData('validator'); $('form').removeData('unobtrusiveValidation'); $.validator.unobtrusive.parse('form'); }); </script> |
I hope you enjoyed learning about how to enable the Unobtrusive Jquery validation for a form in MVC on page transfer.
You can refer to our ASP.NET MVC Controls to know about its other groundbreaking feature representations and how to quickly get started for configuration specifications. You can also explore our demo to understand how to create and manipulate data.
For current customers, you can check out our components from the License and Downloads page. If you are new to Syncfusion, you can try our 30-day free trial to check out our other controls.
If you have any queries or require clarifications, please let us know in the comments section below. You can also contact us through our support forums, Direct-Trac, or feedback portal. We are always happy to assist you!
