Unable to parse bindings from JSON

[ronny...@gmail.com]

I have a view model that fetches JSON through AJAX, and creates a new Task, but Knockout keep giving me a binding error.

If I hard code the data coming from the server straight in my view model, I don't receive any errors.

My view model creates new task, that has an id, a question and a number of alteratives, which in itself has a text and correct boolean flag.

The following code works perfectly fine:

function Task(data) {

    var self = this;

    self.id = data.id;

    self.question = ko.observable(data.question);

    var alts = new Array();

    $(data.alternatives).each(function(index){

        alts.push(new Alternative(data.alternatives[index].alternative, data.alternatives[index].correct));

    });

    self.alternatives = ko.observableArray(alts);

}

function Alternative(alternativeText, correctAnswer) {

    var self         = this;

    self.alternative = ko.observable(alternativeText);

    self.correct     = ko.observable(correctAnswer);

}

function TaskViewModel() {

    var self = this;

    var data = {

        id: 5,

        question: 'test',

        alternatives: [{

            alternative: 'alt 1',

            correct: false

        },{

            alternative: 'alt 2',

            correct: true

        },{

            alternative: 'alt 3',

            correct: false

        }]

    };

    self.task = new Task(data);

}

But if I exhcange the hard coded data variable with real data from the server:

function TaskViewModel() {

    var self = this;

    $.getJSON('/data', function(data){

        self.task = new Task(data);

    });

}

Knockout gives me this error:

Error: Unable to parse bindings.

Message: ReferenceError: Can't find variable: task;

Bindings value: value: task.question

The data from the URL looks like the following:

{"id":5,"question":"test","alternatives":[{"alternative":"alt 1","correct":false},{"alternative":"alt 2","correct":true},{"alternative":"alt 3","correct":false}]}

I can't seem to figure out why this won't work :/

[Denis Kuzin]

maybe:

function TaskViewModel() {

    var self = this;

self.task = ko.observable(null);

    $.getJSON('/data', function(data){

        $.map(data, function(item) {self.task(new Task(data));

 });

   });

}

2012/11/12 <ronny...@gmail.com>

--
--
Денис Кузин
dekusworld.ru