CODEWITHSUNDEEP
knockout.js
WinKi
WinKi

Reputation: 25

knockout observableArray not change

Here is my code:

<table>
  <tbody data-bind="foreach:Models">
     <tr>
         <td data-bind="text:Id"></td>
         <td data-bind="text:name"></td>
     </tr>
  </tbody>
</table>
function viewModel(){
   var self = this;
   self.Models = ko.observableArray();
}
var vm = new viewModel();

function mappingDatas(id){
  var results = [{ Id:1,name:"One" },{Id:2,name:"Two"}];
   if(id == 1)
   {
       results = [{ Id:3,name:"Three" },{Id:4,name:"Four"}]；
   } 
   vm.Models = ko.mapping.fromJS(results);
   //vm.Models = ko.mapping.fromJS(results,vm.Models);//ie8 throw Stack overflow at line:4
   ko.applyBindings(vm);
}
$(function(){
   mappingDatas(0);
   $('#btn').click(function(){
      mappingDatas(1);
   })
});

The code could be running，but, when the results changed(btn click), it can't work. the error is： "NotFoundError:Node was not found". How can I do? thanks!!!

Upvotes: 0

Views: 93

Answers (1)

pax162
pax162

Reputation: 4735

I changed your js a little, seems to be working now. You don't need to applyBindings again after you change the results array, you can just update vm.Models directly. Fiddle: http://jsfiddle.net/aW6yw/3/

js:

function viewModel(){
   var self = this;
   self.Models = ko.observableArray();
}
var vm = new viewModel();

function mappingDatas(id){
  var results = [{ Id:1,name:"One" },{Id:2,name:"Two"}];
   if(id == 1)
   {
       results = [{ Id:3,name:"Three" },{Id:4,name:"Four"}];
   } 
    var vmResults = ko.mapping.fromJS(results);
   vm.Models(vmResults());

   //vm.Models = ko.mapping.fromJS(results,vm.Models);//ie8 throw Stack overflow at line:4
   //ko.applyBindings(vm);
}


   mappingDatas(0);
   $('#btn').click(function(){
      mappingDatas(1);
   })

ko.applyBindings(vm);

Upvotes: 1

Related Questions