If I declare a view as
Then declare the js as
I've two issues, One if I properly instantiate the viewModel in the view.init, then the select source binding barfs because the array is not set when the binding is invoked. What can I do to have the viewmodel late bound? I've tried using kendo.bind(e.view.element, model) but this has the undesirable side-effect of destroying my
Two, when using SPA every visit to this view invokes another repetition of the 'change' event handler. Thus, the first time I visit this view, the change handler is accurately invoked only once. The second visit invokes the change handler twice. Third view yields three executions and so on. I'm assuming this has to do with the binding engine retaining a hook to the previous underlying object. What can I do to ensure the change is only fired the one time for the current underlying regardless of the view count?
<
div
data-role
=
"view"
data-title
=
"Form Unexpected but nice"
data-init
=
"ns.viewA.init"
data-before-show
=
"ns.viewA.beforeShow"
data-show
=
"ns.viewA.show"
data-model
=
"ns.viewA.viewModel"
>
...
<
select
data-bind
=
"source:options,value:underlying.optionId"
data-text-field
=
"display"
data-value-field
=
"id"
></
select
>
...
</
div
>
01.
(
function
($, kendo, ns){
02.
var
model = {
03.
options: [],
04.
underlying:
null
05.
};
06.
07.
model.bind(
'change'
,
function
(e) {
08.
var
t;
09.
console.info(
'field %s changed.'
, e.field);
10.
if
(e.field ===
'underlying.optionId'
) {
11.
t = viewModel.options.singleOrDefault(
'id'
, model.underlying.optionId);
12.
viewModel.set(
'model.underlying.derivedValue'
, t.someValue);
13.
}
14.
});
15.
16.
ns.viewA = {
17.
init:
function
(){
18.
// populate options
19.
...
20.
},
21.
beforeShow:
function
(){
22.
},
23.
show:
function
(){
24.
model.set(
'underlying'
, {
25.
optionId:
null
,
26.
derivedValue:
'Not Set'
27.
});
28.
},
29.
viewModel: model
30.
};
31.
}(jQuery, kendo, myApp));
I've two issues, One if I properly instantiate the viewModel in the view.init, then the select source binding barfs because the array is not set when the binding is invoked. What can I do to have the viewmodel late bound? I've tried using kendo.bind(e.view.element, model) but this has the undesirable side-effect of destroying my
1.
<
ul
data-role
=
'listview'
><
li
>static option/information</
li
></
ul
>
Two, when using SPA every visit to this view invokes another repetition of the 'change' event handler. Thus, the first time I visit this view, the change handler is accurately invoked only once. The second visit invokes the change handler twice. Third view yields three executions and so on. I'm assuming this has to do with the binding engine retaining a hook to the previous underlying object. What can I do to ensure the change is only fired the one time for the current underlying regardless of the view count?