jquery表单插件，没有错误处理

Question

似乎Jquery.Form插件中没有错误处理工具，这是非常令人沮丧的。尽管文档说我们可以使用$ .ajax选项，但当服务器返回错误时，我仍然无法使用'错误'选项，特别是500和400系列。这个插件是否无法从服务器处理任何错误，或者它是一个错误等？ 有人可以告诉我如何处理这个插件的错误（400,500等）吗？我需要你的帮助...我想要的只是一个简单的错误处理...谢谢。

$("#uploadingImg").hide(); 

var options = {//Define ajax options 
    type: "post", 
    target: "#responsePanel", 
    beforeSend: function(){ 
     $("#uploadingImg").show(); 
    }, 
    complete: function(xhr, textStatus){ 
     $("#uploadingImg").hide(); 
    }, 
    success: function(response, statusString, xhr, $form){ 
     // I know what to do here since this option works fine 
    }, 
    error: function(response, status, err){ 
     // This option doesn't catch any of the error below, 
     // everything is always 'OK' a.k.a 200 
     if(response.status == 400){ 
      console.log("Sorry, this is bad request!"); 
     } 
     if(response.status == 601){ 
      sessionTimedOut(); 
     } 
    } 
} 
$("#polygonUploadForm").submit(function(){ 
    $(this).ajaxSubmit(options); // Using the jquery.form plugin 
    return false; 
}); 

Answer 1

刚刚发现的jquery.form插件本身不会因“文件输入”标签处理文件上传的方式处理服务器错误，因为它没有获得响应头。所以我认为W3C需要检查那个麻烦的标签，它不仅不能让你用CSS来设计它，而且也不会使服务器响应处理变得简单。

必须有它周围虽然方式...

让我知道，如果我说错了话，让我知道这个“文件输入”标签的想法...

Answer 2

在选项

var options = { 
    target:  '#output2',  
    beforeSubmit: showRequest, 
    success:  showResponse, 
timeout: 1000 
}; 

出现错误时没有触发器调用。当你获得500或404时，插件就会挂起。 成功只是在'成功'上行事，这就是我们现在所拥有的一切。

Answer 3

jQuery的表格插件确实手柄错误和documentation是在说明它可以使用$阿贾克斯选项正确。然而，插件将运行在两种模式 - 正常和文件上传。您遇到的问题是因为您正在执行文件上传。 （你不这么说，但是你有#uploadingImg和#polygonUploadForm和递归推理，你有这个问题。）

这是通常说的，但是你不能用AJAX上传文件。此解决方法是使用iframe。表单提交POSTs一个正常的HTTP请求，并在iframe中加载服务器响应。该插件抓住了回应，瞧。 因为这是正常的HTTP请求，所以$ .ajax的规则和行为不适用（因为它没有被使用）。 Form插件可以做的唯一事情就是把它作为一个成功的东西来处理。在代码方面，文件上传永远不会触发分配给ajaxForm（）或ajaxSubmit（）的'error'属性。如果您真的想证明这不是AJAX请求，请将ajaxComplete（）处理程序附加到表单（即完全独立于Form插件的方法）。它也不会被触发。或者看看Firebug的Net-> XHR面板。

所以就是这样 - 上传不是AJAX请求。您可以做的最好的工作是在ajaxForm（）/ ajaxSubmit（）的“成功”或“完整”回调中工作。您被限制而无法访问实际的HTTP响应代码，但您可以检查响应。如果响应为空或者不是您所期望的，您可以通过调用xhr.abort()实际触发“错误”回调。而不是做“if（good response）{yay！} else {oh no！}”，调用abort（）并触发'error'会使代码变得更干净，更容易理解。下面是一个代码示例：

$("#uploadForm").ajaxForm({ 
    success: function(response, textStatus, xhr, form) { 
     console.log("in ajaxForm success"); 

     if (!response.length || response != 'good') { 
      console.log("bad or empty response"); 
      return xhr.abort(); 
     } 
     console.log("All good. Do stuff"); 
    }, 
    error: function(xhr, textStatus, errorThrown) { 
     console.log("in ajaxForm error"); 
    }, 
    complete: function(xhr, textStatus) { 
     console.log("in ajaxForm complete"); 
    } 
}); 

坏时响应在控制台日志打印：

[jquery.form] state = uninitialized 
"NetworkError: 404 NOT FOUND - http://server/fileupload/" 
[jquery.form] state = loading 
[jquery.form] isXml=false 
in ajaxForm success 
bad or empty response 
[jquery.form] aborting upload... aborted 
in ajaxForm error 
in ajaxForm complete 
in ajaxForm complete 

我不知道为什么“完整的”回调运行两次 - 的人？ 最后一件事，如果您问为什么jQuery或Form插件不能只读取iframe的HTTP标头，请阅读this thread。

Answer 4

任何人尚需这个，这是得到它的工作方式

function submitForm() 
{ 
    var isSuccess = false, 
     options = { 
      url   : "posturl.php", 
      type  : 'POST', 
      dataType : 'json', 
      success:function(msg) { 
       //set the variable to true 
       isSuccess = true; 

       //do whatever 
      }, 
      complete: function() { 
       if (isSuccess === false) { 
        //throw the error message 
       } 
      } 
     }; 

    //Ajax submit the form 
    $('#your_form').ajaxSubmit(options); 

    // always return false to prevent standard browser submit and page navigation 
    return false; 
} 

Answer 5

jQuery的表格插件处理服务器响应状态成功（代码200），我认为这些信息就足够了。

从此您可以创建响应状态服务器端

  return $this->returnJson(array(
       'response' => 'success',//error or whatever 
       'data' => 'Succesfully saved in the database' 
      )); 

当然returnJson的

是在前端发送JSON数据（你可以建立一个或你的方法里面做）

功能成功手柄（当响应200发射），你只需要检查你的状态字段（在这种情况下“响应”），下面的例子：

var options = { 
     dataType : 'json', 
     success: handleResponse 
    }; 


    function handleResponse (responseText, statusText, xhr, $form){ 

      if(responseText.response == 'success') { 
        //do something 

       }else if(responseText.response == 'error'){ 
        //do something 

      } 


    }