плагин проверки формы jquery: поле 1 не равно полю 2

#jquery #jquery-plugins

#jquery ( jquery ) #jquery-плагины

Вопрос:

хейхо,

я столкнулся со следующей проблемой: я пытаюсь предотвратить то, чтобы пользователь мог выбирать для полей «имя пользователя» и «электронная почта» одни и те же значения. я использую плагин проверки формы jquery (http://bassistance.de/jquery-plugins/jquery-plugin-validation /)

было бы здорово, если бы кто-нибудь мог показать мне путь, пожалуйста, посмотрите мой код здесь:

 // validate form    
$("#signupform").validate({

    rules: {
        username: {
            required: true,
            minlength: 2,
            remote: "/_misc/formcheck/username.cfm"
        },
        password1: {
            required: true,
            minlength: 5
        },
        password2: {
            required: true,
            minlength: 5,
            equalTo: "#password1"
        },
        email: {
            required: true,
            email: true,
            remote: "/_misc/formcheck/email.cfm"
        },
        email2: {
            required: true,
            email: true,
            equalTo: "#email"
        },
        usage: "required"                       
    },
    messages: {
        username: {
            required: "please username!!",
            minlength: "username at least 2 chars"
        },
        password1: {
            required: "please password!",
            minlength: "password at least 5 chars"
        },
        password2: {
            required: "please password",
            minlength: "password at least 5 chars",
            equalTo: "password fields have to match"
        },
        email: "validate email please!",            
        email2: {
            required: "please provide correct email address!",              
            equalTo: "email fields must match!"
        },
        usage: "please check my terms!" 
    }, 
 

заранее спасибо, мичбек

Ответ №1:

Вы можете добавить пользовательский метод проверки значений имени пользователя и электронной почты и добавить проверку для этого поля.

Демо — версия — http://jsfiddle.net/2hA8M/8 /

Пример —

Способ —

 $.validator.addMethod("user_email_not_same", function(value, element) {
   return $('#name').val() != $('#email').val()
}, "* User and Email should not match");
 

Проверка —

 rules : {
     username : {
         user_email_not_same: true
     }
 },
 

Комментарии:

1. большое вам спасибо, в целом это сработало бы, да, но моя проблема в том, что поле электронной почты по-прежнему остается пустым, когда пользователь заполняет имя пользователя (первое поле в моей форме), поэтому я попытался изменить его: правила: { имя пользователя: { требуется: true, минимальная длина: 2, удаленный: «/ _misc/formcheck/username.cfm» }, email: { требуется: true, email: true, удаленный: «/ _misc /formcheck/email.cfm», user_email_not_same: true }, так не работает, еще один совет для меня?

2. Прилагается демонстрационная версия. Оно все равно должно работать, если оно пустое. Как если бы empty required завершилась неудачей, и даже если проверка выполняется с заполненными значениями, значение не должно совпадать с empty .

3. как вы думаете, проблема может быть в вызовах удаленной проверки?

4. я не уверен в вызовах удаленной проверки .. поскольку не могу протестировать его автономно. Работает ли удаление удаленной проверки нормально?

5. да, это отлично работает: email: { требуется: true, email: true, user_email_not_same: true },

Ответ №2:

Это могло бы быть более гибким:

 $.validator.addMethod("notEqualTo", function (value, element, param)
{
    var target = $(param);
    if (value) return value != target.val();
    else return this.optional(element);
}, "Does not match");
 

Вызов:

 rules: {
    username: {
        required: true,
        minlength: 2,
        remote: "/_misc/formcheck/username.cfm",
        notEqualTo: "#emailId-or-anyValidJquerySelector"
    }
}
 

Образец: http://jsfiddle.net/4AdWR/1 /

Или непосредственно в Html:

 <input type="text" name="username" notEqualTo="#emailId-or-anyValidJquerySelector" minlength="2" class="required" />
 

Пример: http://jsfiddle.net/B2hWn/1 /

И это также учитывает ваши обязательные / необязательные предыдущие проверки 😉

Комментарии:

1. Это здорово, есть ли способ установить сообщение проверки для notEqualTo в атрибутах html?

2. Потрясающе, я просто включил код $.validator.addMethod("notEqualTo", function (value, element, param){ var target = $(param); if (value) return value != target.val(); else return this.optional(element); }, "Does not match"); в конец jquery.validate.min.js файла и вызвал функцию notEqualTo: "#sender_email" , и она работает как шарм 🙂