javascript - Changing observablearray value from viewmodel function -

i have function in view model should change enabled value in array false true.

  editclick: function (user) {      user.enabled = true;      return true;   } 

if put alert show change

user.enabled = true; alert(ko.tojson(user)); 

it shows did change bind value not change.

if put alert in front of change

alert(ko.tojson(user)); user.enabled = true; 

the second time click button alert show value changed.

here jsfiddle code use.

[js]

var myviewmodel = {   myarray: ko.observablearray([{      myname: 'bob',      mysurname: 'smith',      enabled: false   }, {      myname: 'john',      mysurname: 'smith',      enabled: false   }]),   editclick: function (user) {      user.enabled = true;      alert(ko.tojson(user));      return true;   } }; 

[code]

<table border="1" cellpadding="5" cellspacing="0">  <thead>     <tr>         <td>button</td>         <td>value</td>     </tr>  </thead>  <tbody data-bind="foreach: myarray">     <tr>         <td>             <input type="button" value="change" data-bind="click: $root.editclick" />         </td>         <td><span data-bind="text: enabled" />         </td>     </tr>  </tbody> </table> 

i seems change not update viewmodel. there away make work.

thanx

the ko.observablearray tracks item addition or removal.

so in order ko track changes inside of items , automatically updates ui need make properties ko.observable:

myarray: ko.observablearray([{          myname: 'bob',          mysurname: 'smith',          enabled: ko.observable(false)      }, {          myname: 'john',          mysurname: 'smith',          enabled: ko.observable(false)      }]) 

and in editclick need set enabled with: user.enabled(true); (because ko.observable returns function)

editclick: function (user) {          user.enabled(true);          alert(ko.tojson(user));          return true;      } 

demo jsfiddle.