What is the reson behind using $("form").removeData("validator") & $("form").removeData("unobtrusiveValidation"); inside partial view

Question

I am reading the following example link about displaying a partial view inside a popup menu. but i have noticed that inside the partial view the author uses the following code at the end of the view:-

$("form").removeData("validator");
    $("form").removeData("unobtrusiveValidation");
    $.validator.unobtrusive.parse("form");

so can anyone advice what is the purpose behind adding this code?

Answer 1

It removes the jQuery validation from the form. Here is a reference to the validation data.

var form = $(formSelector)
  .removeData("validator") /* added by the raw jquery.validate plugin */
  .removeData("unobtrusiveValidation");
    /* added by the jquery unobtrusive plugin */

To be specific to the implementation in partial view, you can implement the validation with a method like this

function ApplyValidation() {
    $("form").removeData("validator");
    $("form").removeData("unobtrusiveValidation");
    $.validator.unobtrusive.parse("form");
}

Answer 2

In unobtrusive validation, once the validators have been applied for a document, any other validators of dynamic content(partial views or jquery induced html controls) will not be applied. Once we reload the validators, it will bind rules defined inside the model with rules implementation provided by JQuery library, so validation will be performed seamlessly.

The other option (instead of reloading validators) you have is to inject the new rules as shown here.

Access the form's unobtrusiveValidation data using the jquery data method ($(form).data('unobtrusiveValidation')) and access the rules collection and add the new elements attributes.

Answer 3

In my case I use $("form").removeData("validator") because I have 2 differents validations for the same form.. calling different validation according the button has pressed ;)