1

我正在创建一个表单来编辑用户数据,该数据还允许更改密码(如果由用户输入)。我只是不知道如何使用 jQuery Validate 来检查密码是否与密码确认匹配,当且仅当密码字段不为空时。

我搜索了stackoverflow,发现了一些关于skip_or_fill_minimumjQuery Validate 的方法,但是它没有按我的需要工作。

您可以在http://jsfiddle.net/julianonunes/u6DK5/3/查看样本

$(function() {
   $('#form').validate({
       debug: true,
       rules: {
            pwd: {
                minlength: 5,
                skip_or_fill_minimum: [2, ".pw"]
            },
            confirmPwd: {
                equalTo: '#NewPassword',
                skip_or_fill_minimum: [2, ".pw"]
            }
        },
        messages: {
            pwd: {
                minlength: 'Password must have at least 5 characters'
            },
            confirmPwd: {              
                equalTo: 'Password and confirmation do not match'
            }
        }
    }); 
});

HTML:

<form id="form" method="post">
    <p>
        <label for="pwd">Password:</label>
        <input type="password" id="pwd" name="pwd" class="pw" />
    </p>
    <p>
        <label for="confirmPwd">Confirm:</label>
        <input type="password" id="confirmPwd" name="confirmPwd" class="pw" />
    </p>
    <input type="submit" />
</form>
4

1 回答 1

1

您不需要skip_or_fill_minimum规则,也不需要创建自定义方法。

当该字段不是required时,您可以将它们都留空。只需equalTo在第二个字段上使用将强制用户使其匹配。

  • 将第一个字段留空,然后第二个字段可以为空。
  • 在第一个字段中放一些东西,然后第二个必须匹配。

您的代码无法正常工作,因为您的equalTo规则设置为匹配#NewPassword,但您的 HTML 中没有任何input元素与id="NewPassword". 将其更改为id您要匹配的字段;在这种情况下,#pwd,它工作得很好。

工作演示:http: //jsfiddle.net/nMjAy/

$(function () {
    $('#form').validate({
        rules: {
            pwd: {
                minlength: 5
            },
            confirmPwd: {
             // equalTo: '#NewPassword' // <-- no such ID in your HTML
                equalTo: '#pwd'         
            }
        },
        messages: {
            pwd: {
                minlength: 'Password must have at least {0} characters'
            },
            confirmPwd: {
                equalTo: 'Password and confirmation do not match'
            }
        }
    });
});

HTML:

<form id="form" method="post">
    <p>
        <label for="pwd">Password:</label>
        <input type="password" id="pwd" name="pwd" class="pw" />
    </p>
    <p>
        <label for="confirmPwd">Confirm:</label>
        <input type="password" id="confirmPwd" name="confirmPwd" class="pw" />
    </p>
    <input type="submit" />
</form>
于 2013-07-28T17:35:37.330 回答