6

我正在为我的注册表单使用 jquery 验证，它运行良好，但我遇到了问题。我检查电子邮件是否存在，如果电子邮件确实存在，我会收到一条错误消息。现在我想编辑这个，所以，如果电子邮件是免费使用的。错误消息将更改为：此电子邮件可免费使用。

$(document).ready(function(){
    $("#registratieform").validate({
        rules: {
            email: {
                required: true,
                email: true,
                remote: {
                    url: "includes/check_email.php",
                    type: "post",
                    complete: function(data){
                        if( data.responseText == "false" ) {
                            alert("Free");
                          }
                     }
                },
            },
        },

        messages: {
            email: {
                required: "This field is required",
                email: "Please enter a valid email address",
                remote: jQuery.format("{0} is already taken")
            },
        },
    });
});

警报有效，但此消息必须出现在错误所在的标签中。这可能吗？

4

5 回答 5

3

@Ruub：远程消息应该是一个函数，而远程规则只是一个用于检查的网址示例：

$("#registratieform").validate({
    rules: {
        email: {
            required: true,
            email: true,
            remote: "includes/check_email.php"                    
        }
    },
    messages: {
        email: {
            required: "This field is required",
            email: "Please enter a valid email address",
            remote: function() { return $.validator.format("{0} is already taken", $("#email").val()) }
        },
    },
});

在服务器端（包括/check_email.php）：

if (!isValidEmail($_REQUEST['email'])) {
        echo "false";
        exit;
    }
于 2014-12-24T07:36:32.753 回答
3

您可以使用success选项。

如果指定，则显示错误标签以显示有效元素。如果给定一个字符串，它会作为一个类添加到标签中。如果给定一个函数，它会使用标签（作为 jQuery 对象）和经过验证的输入（作为 DOM 元素）调用。标签可用于添加诸如“ok！”之类的文本。

文档中的示例：将类“valid”添加到有效元素，通过 CSS 设置样式，并添加文本“Ok！”。

$("#myform").validate({
    success: function(label) {
        label.addClass("valid").text("Ok!")
    },
    submitHandler: function() { alert("Submitted!") }
});

在您的代码中：

$(document).ready(function(){
    $("#registratieform").validate({
        rules: {
            email: {
                required: true,
                email: true,
                remote: {
                    url: "includes/check_email.php",
                    type: "post",
                    complete: function(data){
                        if( data.responseText == "false" ) {
                            alert("Free");
                          }
                     }
                },
            },
        },

        messages: {
            email: {
                required: "This field is required",
                email: "Please enter a valid email address",
                remote: jQuery.format("{0} is already taken")
            },
        },

        success: function(e) {
            // Remove error message
            // Add success message
        },
    });
});

我建议阅读：.validate()

于 2014-01-27T22:18:22.220 回答
3

我为我们的问题找到了解决方案，花了一天时间了解所有现有的解决方案但没有人让我满意并学习了一点 jqvalidator 的源代码我发现它很容易实现

   $("#myform").validate({
       rules: {
            somealiasname: {
                required: true,
                remote: {
                    url: "www.callthisurl.com/remote",
                    type: "GET",
                    success: function (data) {// Here we got an array of elements for example
                        var result = true,
                            validator = $("#myform").data("validator"), //here we get the validator for current form. We shure that validator is got because during initialization step the form had stored validator once.
                            element = $("#myform").find("input[name=somealiasname]"),
                            currentAlias = element.val(),
                            previous, errors, message, submitted;

                        element = element[0];
                        previous = validator.previousValue(element); // here we get the cached value of element in jqvalidation system

                        data.forEach(function (it) {//here we check if all alias is uniq for example
                            result = !result ? false : it.alias != currentAlias;
                        });

                        validator.settings.messages[element.name].remote = previous.originalMessage; // this code I found in the source code of validator (line 1339)

                        if (result) {
                            submitted = validator.formSubmitted;
                            validator.prepareElement(element);
                            validator.formSubmitted = submitted;
                            validator.successList.push(element);
                            delete validator.invalid[element.name];
                            validator.showErrors();
                        } else {
                            errors = {};
                            message = validator.defaultMessage(element, "remote");
                            errors[element.name] = previous.message = $.isFunction(message) ? message(value) : message;
                            validator.invalid[element.name] = true;
                            validator.showErrors(errors);
                        }

                        previous.valid = result;
                        validator.stopRequest(element, result);
                    }.bind(this)
                }
            }
        }

```

tadam - 一切都很完美！

此代码已使用 jqvalidation 1.14.0 进行测试

我希望，我可以帮助别人

于 2015-09-01T09:19:01.883 回答
1

用您的完整功能替换以下代码：

dataFilter: function (data) {
                        return 'false';// If email not exist
                        return 'true';// If email exist ( Display message on return true )
                    }

请检查这将有所帮助。

于 2016-06-09T11:32:28.240 回答
0

如果要使用 Laravel，我发现这很有用。关键是使用dataFilter

email: {
   required: true,
   remote: {
       headers: {
           'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
       },
       type: "post",
       url: "existsEmail.php",
       data: {email: function() {
           return $('#email').val();
       }},
       dataFilter: function(response) {
           var data = JSON.parse(response);

           return data.success;
       },
   }

messages: {
    email: {
        required: "Email Required",
        remote: $.validator.format("Email Invalid"),
}

重要的是返回状态为 200（或 void），即使返回 false。如果您放置另一个状态，则不会（无）向dataFilter发送正确响应

public function existsEmailCloud(Request $request){
   $sEmail = strtolower($request->email);


   $result = GeneralFunctions::existsEmail($sEmail);


   if($result) {
       return Response::json([
           'success' => true,
       ], 200);
   } else {
       return Response::json([
           'success' => false,
       ], 200);
   }
于 2019-01-08T19:39:09.607 回答