javascript - AJAX 请求后的 JQuery 确认对话框

Question

我需要在服务器端验证具有给定注册号的人是否已经在数据库中。如果此人已经注册，那么我将正常进行程序流程。但是，如果该号码尚未注册，那么我想显示一个确认对话框，询问运算符(operator)是否要使用输入的号码注册一个新人，如果运算符(operator)回答是，那么该人将注册到提交时在表格中告知的编号。

我试过了

服务器端(PHP):

if (!$exists_person) {
  $resp['success'] = false;
  $resp['msg'] = 'Do you want to register a new person?';
  echo json_encode($resp);
}

客户端:

function submit(){
  var data = $('#myForm').serialize();

  $.ajax({
      type: 'POST'
      ,dataType: 'json'
      ,url: 'myPHP.php'
      ,async: 'true'
      ,data: data
      ,error: function(response){
        alert('response');
      }
  });
  return false;
}

我什至看不到警报，那是我想放置确认对话框的地方，消息写在服务器端。其他问题，我如何重新提交附有运算符(operator)回答的整个表格，以便服务器可以检查答案是否为注册这个新人？

编辑

我能够通过这种方式解决问题:

服务器端(PHP):

$person = find($_POST['regNo']);
if ($_POST['register_new'] === 'false' && !$person) {
    $resp['exists'] = false;
    $resp['msg'] = 'Do you want to register a new person?';
    die(json_encode($resp)); //send response to AJAX request on the client side
} else if ($_POST['register_new'] === 'true' && !$person) {
    //register new person
    $person = find($_POST['regNo']);
}

if($person){
    //proceed normal program flow
}

客户端:

function submit(e) {
    e.preventDefault();
    var data = $('#myForm').serialize();
    var ajax1 = $.ajax({
        type: 'POST'
        , dataType: 'json'
        , async: 'true'
        , url: 'myPHP.php'
        , data: data
        , success: function (response) {
            if (!response.exists && confirm(response.msg)) {
                document.getElementById('register_new').value = 'true'; //hidden input
                dados = $('#myForm').serialize(); //reserialize with new data
                var ajax2 = $.ajax({
                    type: 'POST'
                    , dataType: 'json'
                    , async: 'true'
                    , url: 'myPHP.php'
                    , data: data
                    , success: function () {
                        document.getElementById('register_new').value = 'false';
                        $('#myForm').unbind('submit').submit();
                    }
                });
            } else if (response.success) {
                alert(response.msg);
                $('#myForm').unbind('submit').submit();
            }
        }
    });
}

Answer 1

您的 PHP 似乎没有任何问题。

问题是 (1) 您在错误回调中执行警报，并且您的请求没有失败，所以您看不到警报。 (2) 您正在警告字符串 'response' 而不是变量 response。

还值得注意的是，您应该使用 .done() 和 .fail() promise 方法 ( http://api.jquery.com/jquery.ajax/#jqXHR)。

这是固定的 JS:

function submit() {

  var data = $('#myForm').serialize();

  // Same as before, with the error callback removed
  var myAjaxRequest = $.ajax({
    type: 'POST',
    dataType: 'json',
    url: 'myPHP.php',
    async: 'true',
    data: data
  });

  // The request was successful (200)
  myAjaxRequest.done(function(data, textStatus, jqXHR) {
    // The data variable will contain your JSON from the server
    console.log(data);
    // Use a confirmation dialog to ask the user your question
    // sent from the server
    if (confirm(data.msg)) {
      // Perform another AJAX request
    }
  });

  // The request failed (40X)
  myAjaxRequest.fail(function(jqXHR, textStatus, errorThrown) {
    console.log(errorThrown);
  });

  return false;
}

另外，您在 PHP 中设置了一个“状态”并在 JS 中检查它(我推测)。您要做的是从服务器设置一个 HTTP 状态代码，如下所示:

if (!$exists_person) 
{
    $resp['msg'] = 'Do you want to register a new person?';

    // 400 - Bad Request
    http_response_code(400);

    echo json_enconde($resp);
}

然后，jQuery会根据你响应的状态码判断请求是否失败。 200 为请求成功，400 为请求失败。

查看此页面以获取完整列表:https://httpstatuses.com/