Hello,
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):
IA IL IN IR RT
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.
Any ideas what I'm doing wrong?
Thanks.