Question

I am trying to retrieve JSON data from an external text file using a GET request. The code is workinh in Firefox, but it’s not working in Chrome and Internet Explorer.

The JavaScript code is:

$(document).ready(function() {
    $.ajax({
        type: "GET",
        url: "ajax/test.txt",
        dataType: "json",
        cache: false,
        contentType: "application/json",
        success: function(data) {
            //alert("Success");
            $.each(data.dashboard, function(i,post){
                 $('#slider ul').append('<li><a href="'+post.TargetUrl+'" target="'+post.Target+'"><img src="' + post.ImageUrl + '" title="' + post.OverlayText +'" /></a></li>');
            });
            handleSuccess();
        },
        error: function(xhr, status, error) {
            alert(xhr.status);
        }
    });
});

JSON data on a text file

{
    dashboard: [
    {
        "ImageUrl": "images/01.jpg",
        "OverlayText": "demo image 1",
        "TargetUrl": "http://lkamal.com.np",
        "Target": "_blank",
        "Timer ": 2000
    },
    {
        "ImageUrl": "images/02.jpg",
        "OverlayText": "demo image 2",
        "TargetUrl": "http://lkamal.com.np",
        "Target": "_blank",
        "Timer ": 2000
    }
    ]
}

Answer 1

JavaScript generally isn’t allowed to load files from the file system. You’d have to host the project on a web server, then the URL would work, like http://localhost/ajax/test.txt if you host your project on http://localhost/.