I am trying to test a few ajax and JSON parsing examples using YUI3 on localhost. The code is as follows:
<!doctype html>
<html>
<head>
<title>YUI 3 Getting started</title>
</head>
<body>
<p id="time">(what time is it?)</p>
<button id="go">What time is it?</button>
<script src="http://yui.yahooapis.com/3.3.0/build/simpleyui/simpleyui-min.js"></script>
<script>
function printTime(id, response) {
try {
var data = Y.JSON.parse(response.responseText);
}
catch (ex) {
data = { time: "ERROR" };
}
Y.one("#time").setContent(data.time);
}
Y.one("#go").on("click", function () {
Y.io("watch.php", {
on: {
success: printTime
}
});
});
</script>
</body>
</html>
This is watch.php:
<?php
header('Content-Type: application/json; charset=utf8');
echo(
json_encode(
array(
"time" => date("g:ia l, M jS")
)
)
);
I have tried uploading the files to a webhost, and am still getting the same issue. The strange thing is that it works perfectly fine in firefox, but refuses to work in IE9 and other IE modes! IE is returning this error code: c00ce56e.
Any ideas?
Turns out IE9 is very very strict with JSON responses. To be sure, ensure that a proper header with encoding is sent for every JSON response. Also make sure that the JSON is well formed.
This is the fix:
Notice that the charset MUST be defined and must be a valid charset.