jquery - EasyUI Treegrid - insert method does not update children collection -

i using jquery easyui treegrid on project.

i have tree loaded initial data. afterwards, need insert new rows on tree when user clicks "add" button. add click handler has code , working expected:

var row = $treegrid.treegrid('getselected');  if (row) {     var obj = {         id: "x" + ++maxid,         code: "x" + maxid,         amount: 2     };     $treegrid.treegrid('insert', {             after: row.id,             data: obj         });      $("#txtresult").text("added new row: " + obj.id); } 

however afterwards when check children of row (where new child added), not include newly added row.

i have setup jsfiddle demonstrate issue. reproduce it:

1. select row @ 2nd level , click add child. new row added per code above. "row added" message displayed below buttons.

2. select parent , click "show children" button. children count of selected row shown below buttons.

after inserting row, have tried "acceptchanges" of treegrid still not solve problem.

update: per @saigitha-vijay answer, looks using append method correctly updates underlying model (jsfiddle) adds new row last child. there anyway add new row @ particular position?

instead on 'insert' use 'append'. in method, u can pass parent id too.

example,

$('#tt').treegrid('append',{ parent: node.id,  // node has 'id' value defined through 'idfield' property data: [{     id: '073',     name: 'name73' }] }); 

i modified code as,(its working)

 var obj = [{             id: "x" + ++maxid,             code: "x" + maxid,             amount: 2         }];          $treegrid.treegrid('append', {             parent: row.id,             data: obj         });