对动态生成的表单使用jQuery表单验证equalTo规则

Question

我在一页上有n个表格。 每个都有两个电子邮件地址字段（普通字段和验证）。 我要为两个字段设置一个equalTo规则。 我现在正在做的是这样的：

$(".contactform").validate({
   onsubmit: true,
   onkeydown: false,
   onkeyup: false,
   onfocusin: false,
   onfocusout: false,
   onchange: false,
   onclick: false,
      rules: {
         email_veri: {
            equalTo: ".email"
         }
      }
});

但这显然不起作用，因为每种形式的email和email_veri的ID都不同。 我读到可以直接在字段上设置验证规则，但我没有找到具体方法。 我希望有人能帮帮忙。

Answer 1

这可能很有用，它来自http://www.epalla.com/2009/12/jquery-validation-with-multiple-forms/上的 “具有多个（大部分）相同表单的jQuery验证”

他们的答案是分别验证每种形式：

$(".question_form").each(function() {
    $(this).validate(
        rules: {
            email_veri: {
                equalTo: ".email"
        }
    );
});

Answer 2

Hiya为您创建了一个非常简单的演示： http : //jsfiddle.net/bY5P6/

因此，如果您键入不同的电子邮件和电子邮件验证字段，那么您将获得equal to消息验证相同的效果。

进一步的文档： http : //docs.jquery.com/Plugins/Validation/Methods/equalTo

或用于多个表单，请参见此处：使用JQuery验证插件来验证具有相同名称的多个表单字段

如果您使用多种表格，请确保引用：

验证要求字段名称必须唯一，但单选按钮和复选框除外。

:)！

jQuery代码

//================================= AZIONE FORM
$('#submit').click(function() {
    $('#mailer').submit();
    return false;
});

//================================= VALIDAZIONE FORM
$('#mailer').validate({
    focusInvalid: false,
    debug: true,
    rules: {
        name: {
            required: true
        },
        email_address: {
            required: true,
            email: true
        },
        email_address_veri: {
            required: true,
            email: true,
            equalTo: ".email"
        },
        request: {
            required: true
        }
    },
    messages: {
        name: {
            required: 'name required'
        },
        email_address: {
            required: 'email required',
            email: 'email address is not valid'
        },
        email_address_veri: {
            required: 'email required',
            email: 'email address verification is not valid',
            equalTo: "Please enter the same email as above"
        },
        request: {
            required: 'request required'
        }
    }
});

的HTML

<!doctype html>
<html class="no-js" lang="en">
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>

        <form action="#" method="post" id="mailer" autocomplete="off">
            <label>
                <span>name</span>
                <input type="text" name="name" required="required" value="" />
            </label><br /><br />
            <label>
                <span>email</span>
                <input type="email" name="email_address" class="email"  value="" />
            </label><br /><br />
            <label>
                <span>email Verification</span>
                <input type="email" name="email_address_veri"  value="" />
            </label><br /><br />
            <label>
                <span>request</span>
                <textarea name="request" required="required"></textarea>
            </label><br /><br />
            <a href="javascript:;" id="submit">submit</a>

        </form>

    </body>
</html>

输出量

在此处输入图片说明

对动态生成的表单使用jQuery表单验证equalTo规则

问题描述

2 个解决方案

解决方案1
2 已采纳 2012-04-25 01:54:34

解决方案2
1 2012-04-25 01:25:38

对动态生成的表单使用jQuery表单验证equalTo规则

问题描述

2 个解决方案

解决方案1 2 已采纳 2012-04-25 01:54:34

解决方案2 1 2012-04-25 01:25:38

解决方案1
2 已采纳 2012-04-25 01:54:34

解决方案2
1 2012-04-25 01:25:38