Php 使用jQuery验证和回调

使用下面的代码，我将在客户端验证中验证注册表表单，并使用post方法将表单提交到我的php页面，并返回一个json对象供jquery处理。如您所见，我已经为初始验证设置了一些规则和消息，以便在客户端处理。在php方面，我让它向用户报告请求的状态、消息以及可能出现的任何错误。我想知道的是，如果有错误，我应该如何处理它，并且我希望我的表单以与用户在被跳过时应该看到的相同的方式向用户显示错误

我希望看到的是，由于示例错误消息存在于我的json对象中，让它看到它附加到相应的字段名，并以某种方式将同一类应用于消息

我的输出数组如下所示：

{
    "status":"error",
    "message":"The following form did not validate successfully. Please fix the form errors and try again.",
    "errors":
    {
        "username":"This username is already available",
        "email_address":"This email address is already available"
    }
}

Jquery验证

$.validator.setDefaults(
{
    submitHandler: function() { alert("submitted!"); },
    showErrors: function(map, list) 
    {
        this.currentElements.parents('label:first, div:first').find('.has-error').remove();
        this.currentElements.parents('.form-group:first').removeClass('has-error');

        $.each(list, function(index, error) 
        {
            var ee = $(error.element);
            var eep = ee.parents('label:first').length ? ee.parents('label:first') : ee.parents('div:first');

            ee.parents('.form-group:first').addClass('has-error');
            eep.find('.has-error').remove();
            eep.append('<p class="has-error help-block">' + error.message + '</p>');
        });
    }
});

$(function()
{
    $("#register_form").validate({
        rules: {
            username: {
                required: true,
            },
            password: {
                required: true,
                minlength: 6,
                maxlength: 12
            },
            email_address: {
                required: true,
                email: true
            },
        },
        messages: {
            username: {
                required: "Please enter a username",
            },
            password: {
                required: "Please provide a password",
                minlength: "Your password must be at least 6 characters long",
                maxlength: "Your password must be no more than 12 characters long"
            },
            email_address: {
                required: "Please provide an email address",
                email: "Please enter a valid email address"
            }
        },
        submitHandler: function(form) {
            var uri = "/register/process";
            $.post(uri, $( "#register_form" ).serialize(), function(output)
            {
                if (output.status == "notice")
                {
                    /*
                    notyfy({
                        text: output.message,
                        type: 'alert',
                        layout: 'center',
                        closeWith: ['click']
                    });
                    */                    
                }
                else if(output.status == "error")
                {
                    // Show errors even if jQuery validation missed some from server side validation.  

                    notyfy({
                        text: output.message,
                        type: 'error',
                        layout: 'center',
                        closeWith: ['click']
                    });
                }
                else if(output.status == "success")
                {   
                    // Works
                    notyfy({
                        text: output.message,
                        type: 'success',
                        layout: 'center',
                        closeWith: ['click']
                    });  
                }
                else
                {
                    /*
                    notyfy({
                        text: output.message,
                        type: 'warning',
                        layout: 'center',
                        closeWith: ['click']
                    });
                    */
                }
            }, 'json');
            return false;
        }
    });
});

$.validator.setDefaults(
{
submitHandler:function（）{alert（“submitted！”）；}，
淋浴错误：功能（地图、列表）
{
this.currentElements.parents（'label:first，div:first'）.find（'.has error'）.remove（）；
this.currentElements.parents（'.form-group:first'）.removeClass（'has-error'）；
$.each（列表、函数（索引、错误）
{
var ee=$（error.element）；
var eep=ee.parents（'label:first'）。长度？ee.parents（'label:first'）：ee.parents（'div:first'）；
ee.parents（'.formgroup:first'）.addClass（'has-error'）；
eep.find（'.has error'）.remove（）；
eep.append（“
”+error.message+”
）；
});
}
});
$（函数（）
{
$（“#登记表”）。验证({
规则：{
用户名：{
要求：正确，
},
密码：{
要求：正确，
最小长度：6，
最大长度：12
},
电邮地址：{
要求：正确，
电子邮件：真的
},
},
信息：{
用户名：{
必需：“请输入用户名”，
},
密码：{
必填：“请提供密码”，
minlength:“您的密码长度必须至少为6个字符”，
maxlength:“您的密码长度不得超过12个字符”
},
电邮地址：{
必填：“请提供电子邮件地址”，
电子邮件：“请输入有效的电子邮件地址”
}
},
submitHandler:函数（表单）{
var uri=“/register/process”；
$.post（uri，$（“#寄存器_表单”）.serialize（），函数（输出）
{
如果（output.status==“通知”）
{
/*
诺蒂菲({
text:output.message，
键入：“警报”，
布局：“中心”，
closeWith:[“单击”]
});
*/                    
}
else if（output.status==“error”）
{
//即使jQuery验证遗漏了服务器端验证中的一些错误，也会显示错误。
诺蒂菲({
text:output.message，
键入：“错误”，
布局：“中心”，
closeWith:[“单击”]
});
}
else if（output.status==“success”）
{   
//工作
诺蒂菲({
text:output.message，
键入：“成功”，
布局：“中心”，
closeWith:[“单击”]
});  
}
其他的
{
/*
诺蒂菲({
text:output.message，
键入：“警告”，
布局：“中心”，
closeWith:[“单击”]
});
*/
}
}“json”）；
返回false；
}
});
});

---

我一直试图从jquery验证插件的文档中了解应该做什么，并且认为我忽略了一些东西。有人知道或有什么建议吗？任何意见都将被接受。

因此仍有点不清楚。。。是否要使用客户端验证插件显示服务器端验证错误？这是正确的。我不知道我是否可以使用JS中的showErrors函数。

showErrors

是插件的回调函数。没有为您提供外部调用它的方法。然而，我认为你需要重新考虑你的整个方法。服务器端验证和客户端验证是两件完全不同的事情。。。客户端验证用于提供更好的用户体验，而服务器端验证可保护您的数据库。因此，仅仅使用客户端验证插件来显示服务器端错误没有多大意义。你最好还是坚持使用服务器端验证，并使用ajax动态地将消息放在页面上。我目前使用客户端验证，并且在后端进行服务器端验证。我之所以拥有这两个功能，是为了防止发生黑客攻击，我有一个后端作为另一个保护层，当我得到结果时，如果后端有验证错误，那么我可以以与客户端插件相同的方式显示这些结果。我理解它们是不同的。否则我的想法是获取从后端报告的验证错误数组，并匹配表单字段（该字段是hte错误），然后执行css以使其显示sam中的错误