CODEWITHSUNDEEP
jqueryjsonknockout.jsgetjson
Shubh
Shubh

Reputation: 6731

JQuery $.ajax({})- ajax parseerror and Knockout

I have a JS(data.js) file with data as

var Content = {
    Page1: {
        Tiles: [
        { "id": "1",
            "className": "home-test-class",
            "tileType": "widget",
            "tileColor": "red",
            "Bookmark": : {
                "Icon": "iconset", 
                "Class": "dummytext", 
                "Content": "Dummy Content",
                "URL": ""
            },
            "Tile": false,
            "SmallWidget": false,
            "Widget": false
        },
        { 
        "id": "1",
            "className": "title-class",
            "tileType": "widget",
            "tileColor": "red",
            "Bookmark": false,
            "Tile": false,
            "SmallWidget": false,
            "Widget": false
        },
        ]
    }
}

I have created a INIT method to consume this data

Init = function () {
        $.ajax({
            url: 'scripts/data.js',
            dataType: "json",
            contentType: 'application/json; charset=utf-8'
        }).done(function (data) {
            $.doTimeout(1000, function () {
                console.log(data);
                LoadViewData(data);
            });

        }).fail(function (request, error) {
            //Handle Failures here.
            alert('Error' + error);
        });
        ko.applyBindings(this);
    },

It gives me an JsonParse error.

I am using knockout to bind the data to UI. When i use Fiddler and check the response, it say's "The selected response does not contain vaid JSON text

Please let me know how can i fix it.

Upvotes: 3

Views: 246

Answers (1)

ThinkingStiff
ThinkingStiff

Reputation: 65381

It's because you're returning a Javascript file, not JSON data. It makes no sense to use a Javascript file in this way.

If you changed your file to just contain a JSON string (example below), and assuming the rest of your $.ajax() call has no issues, it will work . Note that a proper JSON string encloses all names in double quotes. Also, if you run your JSON through a validator, you'll see it has some issues (I've fixed them in the example).

{
    "Page1": {
        "Tiles": [
            {
                "id": "1",
                "className": "home-test-class",
                "tileType": "widget",
                "tileColor": "red",
                "Bookmark": {
                    "Icon": "iconset",
                    "Class": "dummytext",
                    "Content": "Dummy Content",
                    "URL": ""
                },
                "Tile": false,
                "SmallWidget": false,
                "Widget": false
            },
            {
                "id": "1",
                "className": "title-class",
                "tileType": "widget",
                "tileColor": "red",
                "Bookmark": false,
                "Tile": false,
                "SmallWidget": false,
                "Widget": false
            }
        ]
    }
}

Upvotes: 4

Related Questions