1

我有一个想法,这可能很愚蠢,但我已经坚持了几个小时。

我有一个简单的表单,使用 ajax 进行 jquery 验证以确定电子邮件地址是否已经在数据库中。效果很好。当找到一个电子邮件地址时,它会报告重复,当它不是时,它会保持沉默。

但是当我输入一封我知道是新的电子邮件并填写表格的其余部分并按提交时,它会阻止表格提交并将焦点设置在电子邮件字段上。

这是jQuery:

$(document).ready(function(){
var email;
var name;
var passwd;
var passwd_repeat;

     //form validation rules
     $("#regForm1").validate({
         rules: {
            name: {
                required: true,
                minlength: 3,
            },
            passwd: {
                required: true,
                minlength: 8,
            },
            passwd_repeat: {
                required: true,
                equalTo: passwd,
                minlength: 8
            }
         },
         messages:
         {
             name: "Please enter your name.",
             passwd: "Please enter a password.",
             passwd_repeat: "Passwords must match."
         }
     });

    $.validator.addMethod("validateUserEmail", function(value, element) {
        var inputElem = $('#regForm1 :input[name="email"]'),
        data = { "email=" : inputElem.val() },
        eReport = ''; //error report*/
        var dataString = 'email='+ inputElem.val();
        $.ajax( {
            type: "POST",
            url: '/checkdups.php',
            data: dataString,
            success: function(html) {
                if (html !== 'true') {
                  $('#email').after('<label class="error" for="email">error - '+inputElem.val()+' already in use. Please <a href="http://tester4.com/staff/auth/login">Log in</a> with '+inputElem.val()+'.</label>');
                  return false;
                }
                else {
                    return true;
                }
            },
            error: function(xhr, textStatus, errorThrown)
            {
                alert('ajax loading error... ... '+url + query);
                return false;
            }
        });
    }, 
'');

$(':input[name="email"]').rules("add", { "validateUserEmail" : true} );      

});

我正在使用 addMethod 而不是使用 .remote 添加规则,因为我无法让事情比第一次更有效(这意味着它不会在没有页面刷新的情况下拒绝一连串的欺骗),这被建议为解决方法。当我注释掉添加的方法时,它允许我提交表单,但当然不会检查是否有欺骗性。

无论如何,任何见解都将不胜感激。

约翰

4

2 回答 2

2

你真的应该使用remote. 我不确定为什么您没有按预期工作 - 远程肯定被多次调用。默认情况下,它的工作方式是在您点击提交之前不调用远程页面,然后如果您的远程调用说它很糟糕,那么之后的每次击键都会生成一个新的远程调用。

这是一个简单的工作示例,您可以从中构建。我将其设置为始终返回 false,直到您进行 3 次更改。因此,您应该能够按照以下步骤操作:

  1. 输入 john@rand.com 并单击提交。请注意,它被标记为无效。
  2. 删除 m(无效)
  3. 删除o(无效)
  4. 删除 c(无效,但由于它现在不是有效的电子邮件地址)
  5. 类型com(固定)
  6. 提交(作品)

该小提琴的关键代码在规则对象中(响应是此示例的全局计数器):

rules: {
    email: {
        email: true, 
        remote: {
            url: '/echo/json/',
            data: {
                json: function(){
                    response++;
                    return (response > 3)?'true':'false';
                }
            },
            complete: function(data){
                $('#log').append('remote triggered<br>');
            },
            type: 'post'
        },
        required: true
    }
}
于 2013-03-25T17:48:09.677 回答
0

@Ryley,感谢您的回复。我重试了遥控器,效果很好。我想我的 Firefox 缓存有问题。

我的和你的很像,谢谢!

于 2013-03-25T21:32:44.803 回答