使用带有自定义错误消息的regula.validate()验证表单

时间:2013-12-30 14:22:59

标签: javascript jquery validation regula

我想验证一个带有自定义错误消息的表单,如下所示

<input type="text" name="numberdigit" class="numberClass" placeholder="Number Digit" data-constraints='@Required(message = "Number Digit is required.")' />
<input type="text" name="numberdigit" class="numberClass" placeholder="Number Digit" data-constraints='@Required(message = "Number Digit is required.")' />
<select class="something" name="action" data-constraints='@Required(message = "Please select text1 or text2.")'> <option>text / text2</option> <option value="0">text 1</option> <option value="1">text 2 </option> </select>

`$('form', $parent).submit(function () {
            var validationResults = regula.validate(),
                html = '',
                hasErrors = validationResults.length > 0,
                i;

            if (hasErrors === true) { // fail path


                // iterate over errors
                for(var i = 0; i < validationResults.length; i++) {
// append and show errors
$(".alert-error"+i).append(validationResults[i].message);

                     $(".alert-error"+i).show();
                }



            } else{
//success path

  }`

提交错误显示错误但我想要的是错误需要显示在带有自定义div的输入下面<div class="alert-error0"> Number Digit is required </div>

一些循环没有关闭以及每次错误计数不断增加的一些方法可以帮助我解决问题。如果显示错误,还需要为输入字段添加类。一旦我们输入一些值错误字段并且需要删除错误类

1 个答案:

答案 0 :(得分:1)

每次都会附加一个新元素。您只需更改div

的内容即可

所以而不是:

$(".alert-error"+i).append(validationResults[i].message);

你需要:

$(".alert-error" + i).text(validationResults[i].message);

在成功路径中,您只需要清除每个错误div的内容:

$(".alert_error").empty();