CODEWITHSUNDEEP
jqueryhtmlxmlajax
user899641
user899641

Reputation: 351

JQuery Ajax won't display results in Chrome

This works in IE 8 but not in Chrome 16.0.912.77. Any ideas?

<html> 
<head> 
<script src="http://code.jquery.com/jquery-latest.js"></script> 
<script> 
$(document).ready(function()
{
    $.ajax({
        type: "GET",
        url: "test.xml",
        dataType: "xml",
        success: parseXml
    });
});

function parseXml(xml)
{
    $(xml).find("test").each(function()
    {
        $("#test").append("<tr><td>" + $(this).find("name").text()+"</td><td>" + $(this).find("phone").text()+"</td></tr>");
        $('#test').trigger('create');
    });
}

</script> 
</head> 
<body> 

<table id="test" border="1"></table>
</body> 
</html>

Upvotes: 1

Views: 1040

Answers (1)

Matt Stauffer
Matt Stauffer

Reputation: 2742

If you see the error "Origin null is not allowed by Access-Control-Allow-Origin", you're running into Cross-Origin Resource Sharing issues.

http://en.wikipedia.org/wiki/Cross-Origin_Resource_Sharing

Essentially, with traditional AJAX you can't access files from another origin (domain). So, site1.com can't use regular AJAX to access content from site2.com. There are ways around this (JSONP being the most common).

You're running into this because, since you're running the script on your local computer, there's no origin listed (hence "Origin null" in the error), and the browser won't let you load the file.

If you want to keep developing locally, you can start Chrome with a flag to disable this local security. Learn more here: http://code.google.com/p/chromium/issues/detail?id=40787

Or, you can move the code to a hosted server, and it should work fine there.

Upvotes: 1

Related Questions