验证引擎弹出窗口不工作提交需要html5

时间:2015-12-15 13:50:23

标签: html5 jquery-validation-engine

我在表单中使用html5属性'required'。以下是代码片段

$('form').validationEngine('attach', {
  promptPosition: "centerRight",
  scroll: false,
  binded: false,
  onValidationComplete: function(form, status) {
    if (status == true) {

    } else {
      // foo; 
    }
  }
});
<link href="https://cdnjs.cloudflare.com/ajax/libs/jQuery-Validation-Engine/2.6.4/validationEngine.jquery.min.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jQuery-Validation-Engine/2.6.4/jquery.validationEngine.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jQuery-Validation-Engine/2.6.4/languages/jquery.validationEngine-en.js"></script>
<form method="post">
  <input type="text" id="nameIt1" name="nameIt" placeholder="Product name..." class="text validate[required] nameIt" required="required">
  <input type="submit" value="Submit" class="button yellow">
</form>

此处显示html5本机验证弹出窗口,而不是验证引擎弹出窗口。如果我删除html5属性'required'代码正常工作。

专家们,请对此进行说明。

提前致谢。

内甚

1 个答案:

答案 0 :(得分:0)

实际上,如果此代码的主要目的是验证必需的文本字段,那么您的代码工作正常,因为我已经在我的机器上测试了它。必须存在必需属性才能使该字段本机需要html5。甚至没有必要将该属性设置为任何值,它应该只是这样:

<input type="text" id="nameIt1" name="nameIt" placeholder="Product name..." class="text validate[required] nameIt" required >

它会正常工作。如果删除该属性,表单将使用特定代码中的空字段回发。但是如果你对你的javascript函数做了一些更改,那么你会注意到验证引擎弹出,在这种情况下,不需要所需的属性。见下文:

$('form').validationEngine('attach', {
    promptPosition: "centerRight",
    scroll: false,
    binded: false,
    onValidationComplete: function (form, status) {
        if (status == true) {
            form.validationEngine('detach');
            form.submit();
            alert('it is Ok');
        } else {
            alert('Not OK');
        }
    }
});

我希望这可能有所帮助