使用jquery重置MVC表单

如何重置表单?

即清除所有字段的值,并使用jquery删除ValidationSummary错误消息validation-summary-errors。

我使用下面的代码,但它不起作用:

var validator = $("#myform").validate(); validator.resetForm(); 

我正在使用asp.net MVC3,jquery脚本包含在我的页面中。

    

 $('.field-validation-error') .removeClass('field-validation-error') .addClass('field-validation-valid'); $('.input-validation-error') .removeClass('input-validation-error') .addClass('valid'); 

当我遇到它时,我写了一个快速的jQuery扩展来处理这个问题:

  • 清除字段级validation错误
  • 清除/隐藏validation摘要
  • 重置jQuery Validate的内部错误列表

它可以从表单中的元素$(选定)或自身的表单中调用。

这是一个调用示例(输入在表单中):

  

这是jQuery插件代码:

 (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); 

希望这有帮助! 您可以在此处阅读有关它的更多信息并在我的博客文章中查看其他一些示例:

http://www.johnculviner.com/post/2011/11/16/ClearReset-MVC-3-Form-and-Unobtrusive-jQuery-Client-Validation.aspx

你可以使用原生解决方案(validation1.9.0 +不引人注目)

 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(); 

要跟进Darin Dimitrov的消息,以下内容还将清除validation摘要……

 $(".validation-summary-errors") .removeClass("validation-summary-errors") .addClass("validation-summary-valid"); 

为了完成Darin和Kennifer的回答,我将所有内容放在一起,并添加了最后一部分来重新启用延迟validation

  //Reset validation message $('.field-validation-error') .removeClass('field-validation-error') .addClass('field-validation-valid'); //Reset input, select and textarea style $('.input-validation-error') .removeClass('input-validation-error') .addClass('valid'); //Reset validation summary $(".validation-summary-errors") .removeClass("validation-summary-errors") .addClass("validation-summary-valid"); //To reenable lazy validation (no validation until you submit the form) $('form').removeData('unobtrusiveValidation'); $('form').removeData('validator'); $.validator.unobtrusive.parse($('form')); 

以下代码使用find首先搜索container然后搜索子list 。 如果列表为空,则将validation-summary-valid类添加到容器中,并删除validation-summary-errors

 var container = $('form').find('[data-valmsg-summary="true"]'); var list = container.find('ul'); if (list && list.length) { list.empty(); container.addClass('validation-summary-valid').removeClass('validation-summary-errors'); 

希望这可以帮助你http://www.electrictoolbox.com/jquery-clear-form/

快乐的编码