Question

我有一个带有一些字段的表单，还有同一表单中的另一个表单，我想分别验证上部形式和内部形式，例如：

<form name="upperFORM" ID="upperFORM" >
              <div class="form-control-group">
                <label class="control-label" for="email">Email Address</label>
                <div class="controls">
                  <input type="text" class="input-xlarge" name="email" id="email">
                </div>
              </div>
              <div class="form-control-group">
                <label class="control-label" for="message">Your Address</label>
                <div class="controls">
                  <textarea class="input-xlarge" name="address" id="address" rows="3"></textarea>
                </div>
              </div>
    <form name="innerForm" id="innerForm" >
     <div class="form-control-group">
                <label class="control-label" for="name">Your Name</label>
                <div class="controls">
                  <input type="text" class="input-xlarge" name="name" id="name">
                </div>
              </div>

              <div class="form-control-group">
                <label class="control-label" for="name">User Name</label>
                <div class="controls">
                  <input type="text" class="input-xlarge" name="username" id="username">
                </div>
              </div>
    </form>

</form>

jquery验证：

$('#upperFORM').validate({
    rules: {
        email: {
            required: true,
            required: true
        },

        address: {
            minlength: 6,
            required: true
        }



    },
    highlight: function (element) {
        $(element).closest('.control-group').removeClass('success').addClass('error');
    },
    success: function (element) {
        element
        .text('OK!').addClass('valid')
        .closest('.control-group').removeClass('error').addClass('success');
    }
});

    $('#innerForm').validate({
        rules: {
            name: {
                required: true,
                required: true
            },

            username: {
                minlength: 6,
                required: true
            }



        },
        highlight: function (element) {
            $(element).closest('.control-group').removeClass('success').addClass('error');
        },
        success: function (element) {
            element
            .text('OK!').addClass('valid')
            .closest('.control-group').removeClass('error').addClass('success');
        }
    });

以上代码无效，请帮忙

Answer 1

我有一个带有一些字段的表单，以及同一表单中的另一个表单，我想分别验证上部表单和内部表单。

<form name="upperFORM" ID="upperFORM" >
    ....
    <form name="innerForm" id="innerForm" >
        ....
    </form>
</form>

你不能也不应该这样做。

jQuery Validate插件无法正确处理<form>内的<form>。它被编写为使用有效的HTML标记。
它的HTML无效。没有嵌套form。
这没有任何意义。没有充分理由拥有嵌套form。

您从未通过嵌套form容器来解释您尝试完成的任务，但jQuery Validate对这些容器的唯一方法是将两者分开。

<form name="upperFORM" ID="upperFORM" >....</form>

<form name="innerForm" id="innerForm" >....</form>

无论您是通过嵌套两种形式来尝试完成的，都可以通过其他方式更好地完成。

使用bootstrap formvalidators验证具有多个表单标记的表单

1 个答案: