jQuery 验证器附加方法未按预期工作答案

【问题标题】：jQuery validator additional method not working as expectedjQuery 验证器附加方法未按预期工作
【发布时间】：2016-03-18 05:25:22
【问题描述】：

我正在使用这个 jQuery 验证插件，http://jqueryvalidation.org/ 我正在创建一个添加方法，如下所示。

jQuery.validator.addMethod('exists', function(value, element) {
    $.ajax({
        data: {username: value},
        type: 'POST',
        url: 'action/check/',
        dataType: 'json',
        success: function(data) {
            if (data==true) {
                console.log(data);
                return true;
            }
            if (data==false) {
                console.log(data);
                return false;
            }
        }
    })
}, 'This username is already in use');

我的控制台正在从检查脚本中获取正确的数据，在我的控制台中我可以看到真假等。但我不明白的是，无论输入是什么，验证标志似乎都会标记输入。

rules: {
        password_confirm: {
            equalTo: 'input[name=password]'
        },
        username: {
            exists: true
        }
    }

我的数据库中已经有用户名chris，所以当我在用户名输入中输入chris 时，我应该得到一个重复用户的标志，但不管我得到的是什么类型的验证标志。

我错过了什么

【问题讨论】：

您不能从 ajax 方法返回值，因为您想使用现有的远程规则进行基于 ajax 的验证

标签： javascript jquery ajax validation

【解决方案1】：

您的验证不起作用，因为它是异步的（ajax 请求）。

您可以使用现有的remote rule 来执行此操作，确保您的请求返回真/假作为结果

  rules: {
    password_confirm: {
      equalTo: 'input[name=password]'
    },
    username: {
      remote: {
        url: 'action/check/',
        type: 'POST'
      }
    }
  }

【讨论】：

【解决方案2】：

    jQuery.validator.addMethod('exists', function(value, element) {

         var result = false;

         $.ajax({
            data: {username: value},
            type: 'POST',
            url: 'action/check/',
            dataType: 'json',
            success: function(data) {
                result = data; // make sure data returns bool value
            }
        });

        return result;
    }, 'This username is already in use');

【讨论】：