javascript - Knockout.js problems viewing objects within objects -

javascript - Knockout.js problems viewing objects within objects -

i working on prototype questionnaire system. inquire customers questions on telephone.

using html, js, ko (and dynamic crm datasource).

note i'm new ko day 2! - impressed, thought seems have eve-online learning curve!

the questions stored in dynamics crm , retrieved odata phone call (returning json).

some questions have kid questions, de-normalise original normalised odata result , setup hierarchy in new json object. debugging on object shows represented expected. tree like.

the problem have is, when seek utilize view depth. "error: unable property 'value' of undefined or null reference"

i looked @ article knockout.js create every nested object observable, seemed related problem, retro fitting solution code didnt work me, may have misunderstood problem!

my view shows first level of questions correctly, kid questions work point. when seek , databind data-bind="value: adr_nextquestionyesid().adr_answertype.value null reference error shown above.

however, if info bind data-bind="value: adr_nextquestionyesid().adr_answertype see "[object object]" in view. me suggests should able int value of adr_answertype!

the top level adr_answertype.value bindings work fine, seems issue deeper object.

here viewmodel & model;

note next questions meant (and in json) nested questions within question, can imagine go arbitrarily deep

function questionanswersvm() { var self = this; var questiondataraw = retrievequestionset("15af22a6-3e58-e411-b2a6-00155dfd8300", odatapath); var questiondataorganised = organisequestionhierarchy(questiondataraw); self.questions = ko.mapping.fromjs(questiondataorganised, mapping); }; var mapping = { create: function (options) { homecoming new question(options.data); } }; function question(data) { ko.mapping.fromjs(data, {}, this); // answers this.datetime = ko.observable(data.datetime); this.freetext = ko.observable(data.freetext) this.yesno = ko.observable(data.yes); // next questions - trying create nested question here this.adr_nextquestionyesid = ko.observable(new question(data.adr_nextquestionyesid)); }

here view (with unrelated stuff removed);

particularly note databindings within quesionboxindent div nowadays problem

<section data-bind="foreach: questions"> <div class="questionbox"> <span class="questiontitle"><span data-bind="text: adr_name"></span></span> <div class="questionbody"> <label data-bind="text: adr_questionbody" /> </div> <div data-bind="visible: adr_answertype().value == 1"> <input data-bind="checked: yesno" type="radio" value="true" />yes <input data-bind="checked: yesno" type="radio" value="false" />no <label class="mandatory" data-bind="visible: $data.adr_mandatory()"><b>*</b></label> </div> <div data-bind="visible: adr_answertype().value == 2"> <input data-bind="value: freetext" type="text" name="fname" /> <label class="mandatory" data-bind="visible: $data.adr_mandatory()"><b>*</b></label> </div> </div> <div class="questionboxindent" data-bind="visible: adr_nextquestionyesid().adr_name != null"> <span class="questiontitle"><span data-bind="text: adr_nextquestionyesid().adr_name"></span></span> <div class="questionbody"> <label data-bind="text: adr_nextquestionyesid().adr_questionbody" /> </div> <div> <input data-bind="value: adr_nextquestionyesid().freetext" type="text" name="fname" /> <input data-bind="value: adr_nextquestionyesid().adr_answertype" type="text" name="fname" /> <input data-bind="value: adr_nextquestionyesid().adr_answertype.value" type="text" name="fname" /> <label class="mandatory" data-bind="visible: adr_nextquestionyesid().adr_mandatory"><b>*</b></label> </div> </div> <br />

edit: having spent day on it, thought had cracked using suggestion of sergiu, utilize mapping plugin. got map eventually, seemingly doesnt expose depth thought would. basically, when trying access value on adr_answertype of nested question, same "error: unable property 'value' of undefined or null reference". tried sorts of variations of view syntax access value. though there when looking @ original mapped object debugger. maybe should build model manually, separate stream of research, reading shows me how declare top level model!

many in advance all!

peace

javascript html json knockout.js dynamics-crm-2011