How to Enable jQuery Client-Side Validation in Dynamically Rendered Partial Views in ASP.NET MVC

Recently I was doing some work in an ASP.NET MVC 4 website and was rendering a partial view to a div element via a jQuery AJAX call. I found that when the partial was included in a view from a controller's action method, all the client-side validation worked correctly, but if I rendered the partial view client-side code that was, for example, just getting the partial view by itself and putting into a div element as I was trying to do, the client-side validation wouldn't work.

After doing a little research, I learned that the client-side validation needed to be reset after the partial was rendered via the client-script. To that end, I wrote the following JavaScript function to allow quick and easy resetting of client-side validation in cases such as these. Just pass the CSS selector to the partial's parent form to the function shown below. This, of course, assumes that you also have references to the jQuery unobtrusive validation library.

function ResetValidation(formSelector) {
    $(formSelector).removeData("validator");
    $(formSelector).removeData("unobtrusiveValidation");
    $.validator.unobtrusive.parse($(formSelector));
}

Comments

Popular Posts

Resolving the "n timer(s) still in the queue" Error In Angular Unit Tests

How to Get Norton Security Suite Firewall to Allow Remote Desktop Connections in Windows

How to Determine if a Column Exists in a DataReader

Silent Renew and the "login_required" Error When Using oidc-client

Fixing the "Please add a @Pipe/@Directive/@Component annotation" Error In An Angular App After Upgrading to webpack 4