jQuery .ajax error handling

Question

I'm trying to use jQuery.ajax() to retrieve an html code snippet from table_snippet.html and then replace the element in my html code. My error handler in jQuery.ajax() is being executed instead of the desired success handler.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <title>Table</title>
        <link href="address-data-file.css" type="text/css" rel="stylesheet">
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
        <script src="ajax_goodness.js" type="text/javascript"></script> 
    </head>
    <body onload="func()">
        <div id="div_id">
            <p>Use AJAX to retrieve the file table-snippet.html and then replace the div with the contents of that file.</p>
        </div>
    </body>
</html>

function func(){
    jQuery.ajax({
        type: "GET",
        url: "table_snippet.html",
        dataType: "html",
        success: function(data){
            $("#div_id").html(data);
        },
        error: function(){
            alert("fail");
        }
    });
}

The HTTP status code returned from the request is not 200 OK, which means you have an issue on the server side. Possibly a 404 or 500. Check the request in the console to see the exact error. — Rory McCrossan, May 16 '15 at 16:31
Attempted adding in full url path: /Users/kweihe/Desktop/Task 3/table_snippet.html No success — Kendall Weihe, May 16 '15 at 16:34
@RoryMcCrossan this is the error message I'm getting from the console: XMLHttpRequest cannot load file:///Users/kweihe/Desktop/Task%203/table_snippet.html. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource. What does this mean? — Kendall Weihe, May 16 '15 at 16:37
You can't use ajax with the `file://` protocol, you need a webserver and to serve the page with the `http://` protocol. Download WAMP, LAMP, EasyPHP or one of the other many webservers for development. — adeneo, May 16 '15 at 16:40
See http://stackoverflow.com/questions/18586921/how-to-launch-html-using-chrome-at-allow-file-access-from-files-mode — guest271314, May 16 '15 at 23:15

score -1 · Answer 1 · edited May 16 '15 at 17:43

-1

$(function () {
    $.ajax({url:"table_snippet.html",success:function(result){
      $("#div_id").html(result);
    }});
});

edited May 16 '15 at 17:43

max

96,212
14
104
165

answered May 16 '15 at 16:49

Rajesh Kumar

153
2
4
13

Does not solve the OP's issue which is using ajax with the `file://` protocol. – max May 16 '15 at 17:42

jQuery .ajax error handling

1 Answers1