knockout.js - Knockout mapping seems to break value binding for dropdown -
when using ko mapping plugin view model, binding select, value not set.
jsfiddle:
http://jsfiddle.net/jerryclinesmith/pcn9e/
html:
<h1>with ko.mapping (manager not set)</h1> <div id="option-mapping"> <select data-bind="options: availmanagers, value: manager, optionstext: 'name', optionscaption: 'pick one'"></select> <div data-bind="text: json"></div> </div> <h1>without ko.mapping (manager set)</h1> <div id="option-no-mapping"> <select data-bind="options: availmanagers, value: manager, optionstext: 'name', optionscaption: 'pick one'"></select> <div data-bind="text: json"></div> </div> javascript:
var origdata = { manager: {}, availmanagers: [ {id: 1, name: 'tom'}, {id: 2, name: 'joe'}, {id: 3, name: 'james'}] }; var viewmodel = function(data) { var self = this; ko.mapping.fromjs(data, {}, self); self.json = ko.computed(function() { return ko.tojson(ko.mapping.tojs(self)); }); }; var viewmodelnomapping = function(data) { var self = this; self.manager = ko.observable(data.manager); self.availmanagers = ko.observablearray(data.availmanagers); self.json = ko.computed(function() { var obj = ko.tojs(self); delete obj.json; return ko.tojson(obj); }); }; var vm = new viewmodel(origdata); var vm2 = new viewmodelnomapping(origdata); ko.applybindings(vm, document.getelementbyid('option-mapping')); ko.applybindings(vm2, document.getelementbyid('option-no-mapping')); a view model without mapping plugin seems work expected.
i've hit same problem before blank object, doesn't seem create observable....which means manager plain object, means computed never triggers.
eg, change to... (note: changed manager: {} manager: '' gives convert observable. makes things tick along ok... changed convert json function, other 1 didn't seem show the values on manager.
manager: '', availmanagers: [ { id: 1, name: 'tom'}, { id: 2, name: 'joe'}, { id: 3, name: 'james'}] }; var viewmodel = function(data) { var self = this; //self.manager = ko.observable(); ko.mapping.fromjs(data, {}, self); self.json = ko.computed(function() { var obj = ko.tojs(self); delete obj.json; return ko.tojson(obj); }); }; i'm not sure if bug in mapping plugin, both not converting observable, , not converting correct json display.
and confirm, downloaded mapping plugin , wrote test :-
test('mapping object creates observable', function () { var data = { : {} }; var mapped = ko.mapping.fromjs(data); equal(ko.isobservable(mapped.a), true); }); with result
failed expected: true result: false diff: true false source: @ object.<anonymous> (file:///c:/opensourcereps/knockout/mapping/spec/mappingbehaviors.js:1635:3)
Comments
Post a Comment