Javascript 如果成功或错误，则在不同的div中获取ajax结果

我目前让jQuery根据错误或成功在同一个div中输出结果：

HTML

PHP

$error=''；
$uname=trim（$_POST['username']）；
$email=trim（$_POST['mail_id']）；
$fname=trim（$_POST['firname']）；
$lname=trim（$_POST['lasname']）；
$pswrd=$_POST['passwrd']；
if（空（$_POST['username']））
$error.='
输入用户名；
if（空（$\u POST['mail\u id']））
$error.='
输入电子邮件Id
；
elseif（！filter\u var（$email，filter\u VALIDATE\u email））
$error.='
输入有效电子邮件；
如果（空（$_POST['passwrd']））
$error.='
密码不应为空；
if（空（$_POST['firname']））
$error.='
输入名字；
elseif（！preg_match（“/^[a-zA-Z'-]+$/”，$fname））
$error.='
输入有效的名字；
if（空（$_POST['lasname']））
$error.='
输入姓氏；
elseif（！preg_match（“/^[a-zA-Z'-]+$/”，$lname））
$error.='
输入有效的姓氏；
if（空（$error））{
$status=wp\u create\u user（$uname、$pswrd、$email）；
如果（是错误（$status））{
$msg=''；
foreach（$status->errors as$key=>$val）{
foreach（$val为$k=>$v）{
$msg='
'.$v.
'；
}
}
echo$msg；
}否则{
$msg='
注册成功
；
echo$msg；
}
}否则{
echo$错误；
}
模具（1）；
}
}

我对如何在两个不同的地方得到结果感到困惑

1:Error=显示错误并显示表单，理想情况下，错误应显示在每个表单字段下方，此时表单顶部有一个div

---

2:Success=隐藏表单，仅显示Success消息，将结果数组编码为JSON格式并返回响应

<?php

if ($validation==false)
{
    $result = array ('response'=>'error','message'=>'Some validation error');  
}
else
{
    $result = array ('response'=>'success','message'=>'Success');  
}

 echo json_encode($result);
?>

<script type="text/javascript">
$.ajax({
    type: "POST",
    url: "process.php",
    data: dataString,
    dataType: "json",
    success: function (data) {
        if (data.response == 'error') {
            alert('error');
        } else if (data.response == 'success') {
            alert('success');
        } else {
            alert('sorry there was an error');
        }
    }

}); 
</script>

$.ajax({
类型：“POST”，
url:“process.php”，
数据：dataString，
数据类型：“json”，
成功：功能（数据）{
如果（data.response=='error'）{
警报（“错误”）；
}else if（data.response=='success'）{
警惕（“成功”）；
}否则{
警报（“抱歉，发生了错误”）；
}
}
}); 

将JSON返回（例如）前端比返回一个字符串更容易。JSON将包含ID=>Message形式的键/值对

例如：

$errors = array();

if( empty( $_POST['passwrd'] ) ) {
  $errors['st-psw'] = "Password should not be blank";
} 

if( empty( $_POST['firname'] ) ) {
  $errors['st-fname'] = 'Enter First Name';
} elseif( !preg_match("/^[a-zA-Z'-]+$/",$fname) ) {
  $errors['st-fname'] = 'Enter Valid First Name';
}

...
...

if( empty( $errors ) ){
  $response['success'] = true;
} else {
  $response['success'] = false;
  $response['errors'] = $errors;
}

echo json_encode($response);

<input name="myfield" id="myfield" type="text">

---

然后在javascript中循环JSON对象，并在每个目标之后插入错误消息。

方法1
如果您希望每个已验证字段都有一条错误消息，则：

您有一个表单输入，例如：

$errors = array();

if( empty( $_POST['passwrd'] ) ) {
  $errors['st-psw'] = "Password should not be blank";
} 

if( empty( $_POST['firname'] ) ) {
  $errors['st-fname'] = 'Enter First Name';
} elseif( !preg_match("/^[a-zA-Z'-]+$/",$fname) ) {
  $errors['st-fname'] = 'Enter Valid First Name';
}

...
...

if( empty( $errors ) ){
  $response['success'] = true;
} else {
  $response['success'] = false;
  $response['errors'] = $errors;
}

echo json_encode($response);

<input name="myfield" id="myfield" type="text">

现在来看jquery部分：

var myfield= $("#myfield").val();
if (myfield=='') { $("#myfield_error").show(); }

这里的技巧是以与验证的目标表单元素类似的方式命名错误容器。因此，对于id=“fieldA”，您将出现错误id=“fieldA\u error”。

EDIT1：
如果需要使用类，则需要对代码稍加修改。
您需要形成一个要检查的元素数组。
在数组中循环。
并使用类似于：

var fieldName = $(this).attr('name');
var fieldVallue = $(this).val();
if (fieldVallue=='') 
{ 
  $("#"+fieldName+"_error").show(); 
} 
else 
{ 
  $("#"+fieldName+"_error").hide; 
}

$report['status'] = 'error'
$report['message'] = 'error in xxxx field - please use a proper email'
echo json_encode($report);

方法2

如果您只想拥有两个不同的容器，一个用于成功验证，另一个用于错误/失败验证，那么您需要输出与php文件不同的内容。
因此，您的php文件可以输出如下内容：

var fieldName = $(this).attr('name');
var fieldVallue = $(this).val();
if (fieldVallue=='') 
{ 
  $("#"+fieldName+"_error").show(); 
} 
else 
{ 
  $("#"+fieldName+"_error").hide; 
}

$report['status'] = 'error'
$report['message'] = 'error in xxxx field - please use a proper email'
echo json_encode($report);

然后在ajax成功中，您可以检查得到的响应。解析json响应并根据“状态”将“消息”放在不同的容器中

---

我希望这就是您要查找的内容。

或者，您可以按如下方式分配错误处理程序

var jqxhr = jQuery.post(
    ajaxurl,
    ajaxdata,
    function(res){
        $('#loadingmessage').hide();
        $("#myform").show();
        jQuery("#error-message").html(res);
    }
).fail(function() {
    alert("error");
});

---

如果php代码没有进行验证，请发送一个非2xx代码（带有）。

您到底在做什么？为什么不在做ajax之前先做客户端验证呢request@Pekka웃 目前，错误和成功的结果都显示在同一个div中，我不知道如何在不同的html上获得不同的结果places@Armand我尝试了验证插件，但没有成功，而且php已经在检查错误，如果你问我，我完全同意你的看法。我很乐意为您提供一些帮助您当前代码的问题是它会将php的结果作为一组数据附加，您可以尝试的一件事是在每个错误上创建一个错误数组，并将其序列化为带有键值的JSON，其中，键可以是要显示错误消息id和消息要显示的值的元素，您可以通过数组在javascript循环中添加HTMLTH，以改变我构建代码的方式，如果我可以进行相同的检查，但是在php中，我只是在两个不同的地方输出结果，那就更好了。我看到了，这实际上很好。谢谢方法1看起来很简单，很完美，因为它不需要太多的更改，谢谢你，我们应该使用.myField而不是id，因为我们最多只能有1个id@rob.m请检查我的编辑。希望这种方法更适合你。哈。完全忽略它！谢谢

var jqxhr = jQuery.post(
    ajaxurl,
    ajaxdata,
    function(res){
        $('#loadingmessage').hide();
        $("#myform").show();
        jQuery("#error-message").html(res);
    }
).fail(function() {
    alert("error");
});