How do I reset a form?
i.e. Clear values of all fields and remove ValidationSummary error messages validation-summary-errors with jquery.
I use the below code but it does not work:
var validator = $("#myform").validate();
validator.resetForm();
I'm using asp.net MVC3 and the jquery scripts are include in my page.
<script src="@Url.Content("~/Scripts/jquery-1.4.4.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
I wrote a quick jQuery extension to handle this issue when I encountered it which:
It can be called from an element $(selected) within the form or on the form its self.
Here is a calling example (the input is within a form):
<input onclick="$(this).resetValidation()" type="reset" value="Reset" />
Here is the jQuery plugin code:
(function ($) {
//re-set all client validation given a jQuery selected form or child
$.fn.resetValidation = function () {
var $form = this.closest('form');
//reset jQuery Validate's internals
$form.validate().resetForm();
//reset unobtrusive validation summary, if it exists
$form.find("[data-valmsg-summary=true]")
.removeClass("validation-summary-errors")
.addClass("validation-summary-valid")
.find("ul").empty();
//reset unobtrusive field level, if it exists
$form.find("[data-valmsg-replace]")
.removeClass("field-validation-error")
.addClass("field-validation-valid")
.empty();
return $form;
};
})(jQuery);
Hopefully this helped! You can read more about it and see some other examples on my blog post here as well:
$('.field-validation-error')
.removeClass('field-validation-error')
.addClass('field-validation-valid');
$('.input-validation-error')
.removeClass('input-validation-error')
.addClass('valid');
you could use native solution (validate 1.9.0 + unobtrusive)
var $form = $(this).closest('form');
// reset errors with unobtrusive
$form.trigger('reset.unobtrusiveValidation');
// reset inputs
var validator = $form.validate(); // get saved validator
//validator.settings.ignore = ''; // if form hided (closed ui dialogs, etc)
validator.resetForm();