$.ajax call working fine in IE8 and Doesn't work in firefox and chrome browsers

Question

here is my code

$.ajax(
{
    type: "GET", 
    url: 'http://devserver:7995/stdpart/services/GetAllPartsWithFilter',
    dataType: 'json',
    data: jsonPartsData,
    success: fnGetPartsData, 
    error: PartsLoadError  
});

This is code working fine in IE8, But getting failed in Firefox and Chrome browsers. When i, inspect the XHR object, it's saying the status code code is 0. I have checked all other questions, none of them are helped me to identify the issue.

Let me know, if i am doing any thing wrong in this code. If $.ajax has some compatibility issues, then please suggest something equivalent to it.

Update: We found one solution at http://www.xml.com/pub/a/2005/12/21/json-dynamic-script-tag.html

It is using the concept of Dynamic Scripting. We have done the same thing in our application, then every thing seems to be working now. Yet to analyze fully.

Answer 1

this is because of the Same origin policy. you cannot use ajax to call external sites. if you really want to use, you have to use JSONP. Or you can use serverside proxy for this. means, call external site in the server side and do ajax call to the that webservice.

---

UPDATE:

create webserveice in your site and in the webmethod put following code

string proxyURL = "http://devserver:7995/stdpart/services/GetAllPartsWithFilter";
HttpWebRequest request = (HttpWebRequest)WebRequest.Create(proxyURL);
request.Method = "GET";
HttpWebResponse response = (HttpWebResponse)request.GetResponse();

if (response.StatusCode.ToString().ToLower() == "ok")
{
    Stream content = response.GetResponseStream();
    StreamReader contentReader = new StreamReader(content);         
    return contentReader.ReadToEnd();
}
return string.Empty;

then access local service using your code.

for more information please refer this link

Answer 2

Another solution would be to use the jQuery ajaxTransport extension that uses XDomainRequest for IE8+.