重置表单/从jQuery验证中移除错误类 [英] Reset Form / remove error classes from jQuery validate

问题描述

我有一个使用jQuery验证方法的联系表单。当用户点击重置 - 按钮时，孔接触窗体应该转到初始状态。

这个按钮看起来像：

 < form class =formmethod =postaction =name =contactid =contact> 
< button type =buttonid =cancelclass =btn btn-danger btn-lg>重设< / button> 
< / form> 
  

在我的$（document）.ready-function中的JS代码是： $（＃contact）。 ）.validate（）。resetForm（）;
$（＃contact）。removeClass（has-error）;
}）;

问题：错误文本和输入字段将被删除。但是红色边框（.has-error）或绿色边框（.has-success）不会被删除。

我为您创建了一个JSFiddle：

http://jsfiddle.net/bBc8c/1 /

一个按钮是清除输入文本，另一个是删除错误消息。
我需要一个Button来重置两个（Text，Error Message）和主要问题，从has- *类的红色边框。

一个按钮被声明

$ p $ < button type =buttonid =cancelclass = btn btn-danger btn-lg>重置1< / button>
< button type =resetid =cancel2class =btn btn-danger btn-lg> Reset 2< / button>

解决方案

对于bootstrapvalidator，通过引导模式，

  $（＃editModal）。on（'hidden.bs.modal'，function（）{ 
 
 //从组中删除错误元素
 $（'。form-group'）。removeClass（'has-error has-feedback'）; 
 $ （'.form-group'）。find（'small.help-block'）。hide（）; 
 $（'。form-group'）。find（'i.form-control-feedback'） .hide（）; 
 
}）; 
  

i have a contact form with jQuery validate method. When the user click on "Reset"-button the hole contact form should be go to the initial state.

This is the button looks like:

<form class="form" method="post" action="" name="contact" id="contact">
  <button type="button" id="cancel" class="btn btn-danger btn-lg">Reset</button>
</form>

And the JS-Code in my "$(document).ready-function" is:

$('#cancel').on('click', function () {
   $("#contact").validate().resetForm();
   $("#contact").removeClass("has-error");
});

Problem: The error Text and the Input-fields will be deleted. But the red border (.has-error) or the green border (.has-success) don't be deleted.

i've created an JSFiddle for you:

http://jsfiddle.net/bBc8c/1/

One Button is clear the input text, the other is delete the error Messages. I need a Button which reset both (Text, Error Message) and the main problem the red border from the has-* classes.

One Button is declared as type=submit the other is type=button:

<button type="button" id="cancel" class="btn btn-danger btn-lg">Reset 1</button> 
<button type="reset" id="cancel2" class="btn btn-danger btn-lg">Reset 2</button>

解决方案

For bootstrapvalidator, this might useful when the form being display via bootstrap modal,

$("#editModal").on('hidden.bs.modal', function () {

        //Removing the error elements from the from-group
        $('.form-group').removeClass('has-error has-feedback');
        $('.form-group').find('small.help-block').hide();
        $('.form-group').find('i.form-control-feedback').hide();

    });

这篇关于重置表单/从jQuery验证中移除错误类的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！