I am using jQuery's unobtrusive validation plugin in with ASP.NET MVC. Any fields that are rendered on the server are properly validated.
However, if I dynamically add a field in the form using JavaScript, it is not validated even though it has the appropriate HTML5 data-*
attributes.
Can anyone guide me in right direction on how I can achieve this goal?
Simpler Answer:
I am using MVC 4 and JQuery 1.8. I have made it to a modular function which accepts the jQuery object of the newly added element:
function fnValidateDynamicContent($element) {
var $currForm = $element.closest("form");
$currForm.removeData("validator");
$currForm.removeData("unobtrusiveValidation");
$.validator.unobtrusive.parse($currForm);
$currForm.validate(); // This line is important and added for client side validation to trigger, without this it didn't fire client side errors.
}
For example, if you added a new table with id tblContacts
, then you can invoke like this:
fnValidateDynamicContent($("#tblContacts"))