1

有用的参考资料：

问题：

  1. 为什么 jQuery.validation “文档”如此迟钝，甚至严重缺乏基本示例？

  2. 真正的问题：

我有一个执行 AJAX 调用的自定义验证器。该调用可以返回需要不同错误消息的各种值。我似乎无法辨别如何根据响应来改变错误消息。一些代码：

<html>
<head>
<script>
// Set error value variable default & scope
var checkEmailErrorMessage = "API Error";

// AJAX Failure Error
checkEmailError = function(jqXHR, textStatus, errorThrown) {
    if (jqXHR.status == 404) {
        alert("Could not find the API Server (404)");
    } else {
        alert("Some horrifying error occurred: " + textStatus);
    }
    return false;
};

// AJAX Success Handler
checkEmailResponse = function(data, code, jqXHR) {
    switch (data.code) {
        case 200:
            return true;
        case 401:
            checkEmailErrorMessage = "Duplicate Email";
            alert("Sorry, our system has detected that an account with this email address already exists");
            break;
        case 403:
            checkEmailErrorMessage = "Invalid Email";
            alert("Sorry, our system has detected that this email is forbidden");
            break
        case undefined:
            alert("An undefined error occurred.");
            break;
        default:
            alert("A horrible error occurred.");
            break;
    }
    return false;
};

// The Custom Validator
jQuery.validator.addMethod("checkEmail", function(value, element) {

    $.ajax({
        type: "POST",
        cache: "false",
        async: "false",
        url: "/json/checkEmail",
        dataType: "json",
        data: {
            email: function() {
                return $("#email").val();
            }
        },
        success: checkEmailResponse,
        error: checkEmailError
    });

}, checkEmailErrorMessage);

// The Validator Settings
form_validation_settings = {
    onkeyup: false,
    rules: {
        "email": {
            required: true,
            minlength: 2,
            maxlength: 42,
            email: true,
            checkEmail: true
        }
    }
};

// The Binding
$(document).ready(function(){
    $('#MyForm').validate(form_validation_settings);
});

</script>
</head>

<body>

    <!-- the Form -->
    <form id="MyForm">
        <input type="text" name="email"/>
        <input type="submit" name="submit"/>
    </form>

</body>
</html>

无论如何，错误消息都是“API 错误”。验证文档状态：

消息：可以是由“jQuery.validator.format(value)”创建的函数。

但是我该如何安装呢？我要调用的任何函数都需要是 AJAX 调用的结果。

任何想法表示赞赏。提前致谢！

4

2 回答 2

0

你有两个选择：

  • Remote的工作原理是要求您返回一个“true”的 JSON 字符串。您可以从 AJAX 调用中将完整的错误消息作为带引号的字符串返回：

伪代码：

  print '"'.messages[code].'"';
  • 返回错误代码，然后在您的 ajax 调用中使用dataFilter将其转换为您想要的消息：

在其他地方你已经设置了一个消息数组，如下所示：

 var messages = ['Code 0 error message','Code 1 error message', etc ];

       //in your validate rules
       remote: {
            url: 'foo.php',
            dataFilter: function (data, type) {
                return '"' + messages[data] + '"';
            },
            type: 'post'
        }

选项 1和选项 2的工作示例

于 2013-06-07T16:23:57.583 回答
0

刚遇到同样的问题，没有看到适合我尝试做的答案，但我能够弄清楚如何做必要的事情。任何胆小的人现在请移开你的眼睛。

我想做的是提供有关该字段被拒绝的确切原因的更详细信息，以便用户不会猜测输入应该是什么样子。检查主机名和正则表达式所需的验证器非常复杂（顺便说一句，您知道“0.256.1”是有效的主机名吗？！）

无论如何，这是我能够创建更详细的错误消息的方法：

// helperfunctions.js
function validhostname(value) {
  if(value.length > 254) {
    return {pass: false, str: "hostname too long (" + value.length + ")." }
  }
  if(/[^a-zA-Z0-9\-_\.]/.test(value)) {
    return { pass: false, str: "No special characters besides '-' or '_'." }
  }
  ...
  return { pass: true,  str: "valid hostname." };
}

// clientfunctions.js
var hostnameval = {};

jQuery.validator.addMethod(
  "hostname", 
  function(value, element) {
    hostnameval = validhostname(value);
    return this.optional(element) || hostnameval.pass;
  },
  function() {
    var ret = hostnameval.str || "Invalid hostname.";
    hostnameval = {};
    return ret;
  }
);

到目前为止，在“方法”返回之前从未调用过“消息”，所以我还没有看到“无效的主机名”。显示的字符串。我希望有一种不那么骇人听闻的方式来做这件事，并且很高兴被证明是有的。

于 2017-06-26T02:59:32.857 回答