JQuery ajax error function is executed even if query is successful

jquery ajax xml

18,096

Solution 1

Does this happen in all browsers?

1) You can use complete instead of success and error to handle the status. Use an if to check the XHR return status and branch accordingly.

http://docs.jquery.com/Ajax/jQuery.ajax#options

Solution 2

via http://groups.google.com/group/jquery-en/browse_thread/thread/23679594ebe128a9

the server could return an XML document with a 200 status code. But if the browser can not parse the document a parseerror will occur and jQuery's error handler will be invoked.

Make sure you're returning valid xml :)

Solution 3

AJAX is Asynchronous. Meaning that the $.ajax function will start a request the ajaxHelper.pl. In the meantime it continues to execute your code. The request has no chance to return before you reach the next line after $.ajax(...)

for(var i=0; i<ringType.length; i++){...

So I suppose you're getting an exception that ringType is not defined...? And that might be why the error function is triggered.

18,096

Author by

Adrian

Updated on June 14, 2022

Comments

Adrian about 2 years

I'm trying to learn JQuery - and I have a small problem with ajax. I'm trying to populate a javascript array with values returned from an XML response from a page.
Here's my main page (ajax.html):

<html>
<head>
<script type="text/javascript" src="jquery/jquery.js"></script>
<script type="text/javascript" src="jquery/fiber.js"></script>
</head>
<body>
<p>Ajax</p>
<script>
var ringType = new Array();

</script>
</body>
</html>

fiber.js is this:

//process things for fiber map
jQuery(document).ready(function() {
// do stuff when DOM is ready

//populate and display ringType
$.ajax({
  type: "GET",
  url: "ajaxHelper.pl",
  data: {
      getRingTypes: "1",
      },
  dataType: "xml",
  success: function(xml) {
      //if the query was successfull,
      alert("Got an xml object:"+$(xml));
      $(xml).find("ringType").each( function(){
          alert("Received reply "+$(this).text());
          var type = $(this).html(); //save the value
          //append to ringType array
          ringType.push(type);
      });
  },
  error:function (xhr, ajaxOptions, thrownError){
      alert(xhr.status);
      alert(thrownError);
  }
 });
 for(var i=0; i<ringType.length; i++){
    document.write("<br>"+ringType[i]);
 }

});

ajaxHelper.pl generates this XML (without the backslashes in \?) (as content-type text/xml):

<?xml version="1.0" encoding="ISO-8859-1"?>
    <\?xml version="1.0" encoding="ISO-8859-1"\?>
    <ringType>IA</ringType>
    <ringType>IL</ringType>
    <ringType>IN</ringType>
    <ringType>IR</ringType>
    <ringType>RT</ringType>

The problem is, every time I load ajax.html, the ajax query is successful, but the error function is executed! xhr.status = 200 (meaning the query was ok) and thrownException is undefined.

Adrian about 15 years

Fair enough, but it doesn't even trigger the alerts from starting the success function...
Adrian about 15 years

This behavior happens on all browsers. I will try to use complete instead of success and I'll let you know.
gregers about 15 years

When an error is thrown, the script will stop executing. I haven't looked at the jQuery internals how they handle the exceptions, but just try moving the for loop inside the callback.
Adrian about 15 years

I've added the complete function and when I check it's status, I get "parsererror" - meaning the xml I send is not valid. At least now I know where to keep digging. Thank you!
Adrian about 15 years

Apparently XMLs have to have defining xsd's to be valid. My code will not work without them. Now (that I have created the missing definition), all works as expected.
Diego Barros over 12 years

Had this problem, but with JSON results. Fix was the same though and worked: return valid JSON and the browser is happy, calling the right event on return.