ajax 表单提交多个值并获得响应

Question

我正在使用一个表单并提交一个包含名字、姓氏、电子邮件、用户名作为字段的表单。当 ajax 返回时，它会返回一串错误消息。如何分离该错误消息？ 我正在使用此代码

$(文档).ready(函数 () { $(":button[value=Done]").click(function () { data_first_name = $("#first_name").val(); data_last_name = $("#last_name").val(); data_user_name = $("#user_name").val(); data_email = $("#email").val(); data_role = $("#role").val(); data_password = $("#password").val(); data_profile_image = $("#upload_admin_image").val(); $.post("process/process_add_user.php", { 名字：data_first_name， 姓氏：数据姓氏， 电子邮件：data_email， 角色：data_role， 密码：data_password， 用户名：数据用户名， profile_image：data_profile_image }, 功能（resp）{ $("#first_name_error").html(resp); }); }); });

Answer 1

您可以使用response code。代码应该代表实际错误。

当 ajax 返回时，它会返回一串错误消息。如何区分错误信息？

您可以将错误消息集合作为 JSON 字符串发送，并在错误处理函数中根据需要处理这些错误。

在出错的情况下：

<?php
http_response_code(400);
// maps a form field to an error message.
$a = array('username' => 'no username', 'email' => 'no email');
echo json_encode($a);

正常情况下：

<?php
http_response_code(200);
echo "Success message";

当您可以为单个状态代码设置事件处理程序，甚至只是为success 和fail 回调设置事件处理程序时，此方案适用于许多 ajax 库。

jQuery 示例：

$.ajax({
  statusCode: {
    400: function(jqXHR, textStatus, errorThrown) {
        var errors = JSON.parse(errorThrown);
        if (errors.username) {
            $('#username-error').text(errors.username);
        }
    },
    200: function(data) {
        // ...
    }
  }
});

原生 JavaScript 示例：

var handlers = {
   400: function (responseText) {
       var errors = JSON.parse(responseText);
       if (errors.username) {
           var name_error = document.querySelector('#username-error');
           name_error.textContent = errors.username;
       }
   },
   200: function (responseText) { /* ... */ }
};

function ajaxCall(url, handlers) {
    var r = new XMLHttpRequest(); 
    r.open("POST", url, true);
    r.onreadystatechange = function () {
        if (r.readyState === 4 && typeof handers[r.status] === 'function') {
            handers[r.status](r.responseText);
        }
    };
    r.send(/* ... */);
}

ajaxCall('userform_validation.php', handlers);

Answer 2

要在网页上将 AJAX 响应输出为文本，首先在您的 HTML 中创建一个新的DIV

<div id="response"></div>

并使用以下脚本将 Ajax 文本响应写入DIV。您需要使用函数调用它。

var xmlhttp;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("response").innerHTML=xmlhttp.responseText;
}

更多关于 Ajax 响应的信息http://www.w3schools.com/ajax/ajax_xmlhttprequest_response.asp