2013-10-01 29 views
1

當我更改B列中的選擇時,A列中的文本也應該改變,但不是。 爲什麼?表中的敲除更新單元格值

HTML:

<table> 
    <thead> 
     <tr> 
      <th style="width: 100px;">A</th> 
      <th style="width: 100px;">B</th> 
     </tr> 
    </thead> 
    <tbody data-bind="foreach: Data"> 
     <tr> 
      <td><span data-bind="text: idOpt"></span></td> 
      <td><select data-bind="options: $root.MyOptions, optionsText: 'name', optionsValue: 'id', value: idOpt"></select></td> 
     </tr> 
    </tbody> 
</table> 

JS:

function AppViewModel() { 
    var self = this; 
    self.MyOptions = ko.observableArray([ 
     {id: 'a1', name: 'One'}, 
     {id: 'a2', name: 'Two'}, 
     {id: 'a3', name: 'Three'} 
    ]); 

    self.Data = ko.observableArray([ 
     {idOpt: 'a1'}, 
     {idOpt: 'a2'}, 
     {idOpt: 'a1'} 
    ]); 
} 

var vm = new AppViewModel(); 
ko.applyBindings(vm); 

http://jsfiddle.net/bnowicki/CrVBr/2/

請幫助。

回答

2

如果您希望它們綁定/更新,則必須將Data數組中的項聲明爲可觀察項。

function AppViewModel() { 
    var self = this; 
    self.MyOptions = ko.observableArray([ 
     {id: 'a1', name: 'One'}, 
     {id: 'a2', name: 'Two'}, 
     {id: 'a3', name: 'Three'} 
    ]); 

    self.Data = ko.observableArray([ 
     {idOpt: ko.observable('a1')}, 
     {idOpt: ko.observable('a2')}, 
     {idOpt: ko.observable('a1')} 
    ]); 
} 

var vm = new AppViewModel(); 
ko.applyBindings(vm); 

淘汰賽文檔顯示你使用普通模式之間的差異,然後機型觀測http://knockoutjs.com/documentation/observables.html