为什么我无法在 AJAX 响应中打印错误消息？答案

【问题标题】：Why I'm not able to print the error messages in AJAX response?为什么我无法在 AJAX 响应中打印错误消息？
【发布时间】：2014-10-09 12:23:15
【问题描述】：

我有以下 HTML 代码：

<a href="#" id="promotion_status_1">
    <button type="button" class="btn btn-default brmodalbtn" data-toggle="modal" data-target="#BrandImageModal" id="1">On</button>
</a>

<div class="container">
  <div class="modal fade" id="BrandImgeModaal">
    <div class="modal-dialog">
      <div class="modal-content">
        <form id="form" enctype="multipart/form-data" role="form">
          <input type="text" class="form-control" name="brand_id" id="brand_id" value="{$data.id}">
          <input type="text" name="admin_url" id="admin_url" value="http://localhost/abc.com">    
          <input type="text" name="op" value="upload_brand_image">    
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
            <h4 class="modal-title">Brand Image</h4>
          </div>
          <div class="modal-body">
            <div id="messages"></div>
            <input type="file" name="file" id="file">
          </div>
          <div class="modal-footer">
            <button type="submit" class="btn btn-primary">Save</button>
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
          </div>
        </form>
      </div>
    </div>
  </div>
</div>

jQuery AJAX 代码：

$('#form').submit(function(e) {
  var form = $(this);
  var formdata = false;
  if(window.FormData) {
    formdata = new FormData(form[0]);
  }    
  var formAction = form.attr('action');

  $.ajax({
    type        : 'POST',
    url         : 'manufacturers.php',
    cache       : false,
    data        : formdata ? formdata : form.serialize(),
    //data      : formdata ? formdata : form.serialize() + '&' + $.param({'op':'upload_brand_image'}),
    contentType : false,
    processData : false,

    success: function(response) { alert(response); return;
      if(response.error == 1) {             
        $('#BrandImageModal').modal('hide');
      } else { 
        $('#messages').addClass('alert alert-danger').text(response);
      }
    },
    dataType:"JSON"
  });
  e.preventDefault();
});

PHP 代码：

$request = $_REQUEST ;
switch( $op ) {
    case "upload_brand_image":

      $ret = $objManufacturer->UploadBrandImage($request, $_FILES, $allowed_image_extension, $manuf_error_messages);

      if(!$ret) { 
        $error_msg = $objManufacturer->GetAllErrors();

        $response = array(
          "error" => 1,
          "error_message" => $error_msg
        );

        echo(json_encode($response));
      } else {        
        if(!empty($_FILES['file']['name'])) {
          upload_file_now( $_FILES['file'], $brand_image_path, $t, $brand_name, $ext);          
        }      
      }
      die;
      break;
  }

$error_msg 数组包含以下内容：

Array
(
    [domain_id] => Please select domain
    [brand_name] => Brand name can't be blank
    [brand_name_invalid] => Brand name is not valid, it should be alphabetic
    [email] => Brand email can't be blank
    [email_invalid] => Brand email is not valid
    [brand_image] => Brand image can't be blank
    [brand_image_format] => Please upload brand image in a proper format
    [brand_image_size] => Brand image size is greater than 5 MB
    [brand_image_dimesnions] => Only upload brand image having dimensions >= 940 X 370 px
    [details] => Brand details can't be blank
)

我无法在引导模式中打印此数组中包含的消息。

我哪里做错了？有人可以在这方面帮助我吗？

谢谢

【问题讨论】：

你有alert(response); return; 返回将强制终止函数的其余部分...从那里删除return
@ArunPJohny：我添加了返回以进行调试。即使删除 return 它也不会打印错误消息。
是否提醒正确的值？
查看这一行$('#messages').addClass('alert alert-danger').text(response); 要编写错误消息，您应该将其写入$('#messages').addClass('alert alert-danger').text(response.error_message);，因为您返回一个json 对象。你把它放到一个文本中。 reponse 仍然是对象，而不是对象内部的错误消息。
也应该在 if 块中而不是在 else 块中

标签： javascript php jquery ajax response

【解决方案1】：

只需更改成功代码...

$('#form').submit(function(e) {
var form = $(this);
var formdata = false;
if(window.FormData) {
formdata = new FormData(form[0]);
}

var formAction = form.attr('action');
$.ajax({
type        : 'POST',
url         : 'manufacturers.php',
cache       : false,
data        : formdata ? formdata : form.serialize(),
//data      : formdata ? formdata : form.serialize() + '&' + $.param({'op':'upload_brand_image'}),
contentType : false,
processData : false,

success: function (response) {
          alert('successful : ' + response);
      },
      error: function(data, errorThrown)
      {
          alert('request failed :'+errorThrown);
      } 
dataType:"JSON"
});
e.preventDefault();
});

【讨论】：

【解决方案2】：

请记住，json 数据作为文本从服务器传递到浏览器，为了合理使用它，您需要使用 $.parseJSON() 将其转换为适当的 JSON 对象

所以试试

success: function(response) { 
  response = $.parseJSON(response);
  if(response.error == 1) {

此外，现代浏览器都有与之关联的 javascript 调试器。习惯使用它。然后您可以在success: 方法的第一行设置断点并查看返回数据的内容，以及范围内的几乎所有其他内容。

【讨论】：