ajax request error but no error in firebug

Question

i have following ajax code in which i'm making a GET request to a url and retrieving webpage (html) response.

FYI: firefox_v_26

<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script type="text/javascript">
$.ajax({

        url: "http://zenhabits.net",

        type: "GET",

        dataType : "html",

        success: function( data ) {
            alert("success")
        },

        error: function( xhr, status ) {
            alert("error");
        },



});
</script>

it is alerting with error message. But when i traced the request in firebug, response is 200 . according to firebug i have made the request successfully.

What can be the issue here?

Answer 1

Please Write this in your code

error: function( xhr, status ) {
            console.log("xhr : "+xhr+" Status: "+status);
        }

then after Ajax call you check error in firebug or instead make a break point in error function At finally locate error message

I am almost sure you made a Cross Domain request, What is Cross Domain? It allows you to make a request to another domain For example when you call Ajax from localhost to http://zenhabits.net you make a cross domain request, OR even when you make an Ajax call from sub domain to main domain, you make a cross domain request. See this example: Suppose I am developing an Ajax request for "api.jquery.com" within "api.jquery.com" sub domain and not the main domain which is "www.jquery.com". The returned value is "success" , but if you go to "www.jquery.com" and again call this request you get "error" because you had a cross domain request

$.ajax({
        url: "http://api.jquery.com",
        type: "GET",
        dataType : "html",
        success: function( data ) {
            alert("success")
        },
        error: function( xhr, status ) {
            alert("error");
        }
});