javascript - How can I map and observe in the same time in jqxGrid? -

i use jqxgrid knockoutjs. bind grid object array. when use mapping, values of grid not refresh. if push new object array added grid.

<script type="text/javascript"> var viewmodel = null; var initialdata = [   { name: "well-travelled kitten", sales: 352, price: 75.95, address: { city: "asdf", street: "asdf"} },   { name: "speedy coyote", sales: 89, price: 190.00, address: { city: "asdf", street: "asdf"} },   { name: "furious lizard", sales: 152, price: 25.00, address: { city: "asdf", street: "asdf"} },   { name: "indifferent monkey", sales: 1, price: 99.95, address: { city: "asdf", street: "asdf"} },   { name: "brooding dragon", sales: 0, price: 6350, address: { city: "asdf", street: "asdf"} },   { name: "ingenious tadpole", sales: 39450, price: 0.35, address: { city: "asdf", street: "asdf"} },   { name: "optimistic snail", sales: 420, price: 1.50, address: { city: "asdf", street: "asdf"} } ]; $(document).ready(function () {   var gridmodel = function (items) {     this.items = ko.observablearray(items);     this.additem = function () {       this.items.push({ name: "new item", sales: math.round(math.random() * 100), price: math.round(math.random() * 100),address: { city: "asdf", street: "asdf"} });       $("#jqxgrid").jqxgrid('updatebounddata');     };     this.removeitem = function () {       this.items.pop();       $("#jqxgrid").jqxgrid('updatebounddata');     };     this.source = {       datafields: [         { name: 'name' },       ],       localdata: initialdata     }   };   viewmodel = new gridmodel(initialdata);   ko.applybindings(viewmodel);   var dataadapter = new $.jqx.dataadapter(viewmodel.source,{ autobind: true});   dataadapter.databind();   // create jqxgrid.   $("#jqxgrid").jqxgrid({     source: dataadapter,     autoheight: true,     pageable: true,     editable: true,     columns: [       { text: 'name', datafield: 'name', width: 200 },       { text: 'sales', datafield: 'sales', width: 200, cellsalign: 'right' },       { text: 'price', datafield: 'price', width: 200, cellsformat: 'c2', cellsalign: 'right' },     ]   }); }); </script> 

if not write

datafields: [  { name: 'name' }, ], 

into source, good.

how able map , keep observe effect @ same time?

items of array should ko.observable itselfs. try such additem function:

this.additem = function () {       this.items.push(             ko.observable({ name: "new item", sales: math.round(math.random() * 100), price: math.round(math.random() * 100),address: { city: "asdf", street: "asdf"} })       );       $("#jqxgrid").jqxgrid('updatebounddata');     };