即使未按要求设置输入,jquery验证规则也适用

时间:2015-12-02 16:40:16

标签: jquery forms validation

我正在讨论有关如何使用jQuery验证规则的问题。

如果声明了FirstName规则,即使输入没有设置必需的属性,jQuery validate也会触发该字段的验证错误。

我在jQuery表单构建器插件中将验证作为嵌套函数运行。 该插件基于从marketo收到的json数据生成表单。 嵌套验证的原因是,可以在一个脚本中管理多个域中的多个表单的验证。

我查询如何阻止规则触发所需属性的原因不适用于表单字段是因为marketo如何输出表单和表单名称。

示例表单:

<form action="" id="form" method="post">
  <div class="formrow">
    <label for="FirstName">First name: </label>
    <input type="text" name="FirstName" id="FirstName">
  </div>
  <input type="submit" value="submit">
</form>

验证示例:

  $('#form').validate({
    rules: {
      FirstName: {
        required: true
      }
    },
    messages: {
      FirstName: "Please enter your name"
    },
    submitHandler: function (form) {
      $(form).ajaxSubmit({
        error: function (response) {
          console.log(response);
        },
        success: function (response) {
          console.log(response);
        }
      });
    },
    errorElement: "em",
    errorPlacement: function (error, element) {
      error.appendTo(element.closest(".formrow").children("label"));
    }
  });

我已经整理了一个演示来展示这个问题。

http://jsfiddle.net/onebitrocket/dzv5ugo0/

1 个答案:

答案 0 :(得分:1)

required属性不在元素上,但您已在required: true rules对象中定义了FirstName,因此需要该字段。删除该元素的rules对象,它应该可以根据需要运行。

Updated fiddle