I have iggrid which complains about the grid feature "Updating" to be added to dynamically rebind the grid but after I do add that feature, it throws an error of "newds" is not a function. I am using durandal and binding it to an observable array. How do i rebind the grid in this scenario? My product is 14.2 ignite UI.
Hello Renison,
Here are 2 approaches:
1) Re-creating the grid (faster from performance perspective)
var model, gridOpts = { primaryKey: "contactID1", features: [ { name: "Updating", editMode: "none", enableAddRow: false, enableDeleteRow: true, columnSettings: [ ] } ] }; $(function () { model = ko.mapping.fromJS(dataSource); gridOpts.dataSource = model.data; ko.applyBindingsToNode($("#grid")[0], { igGrid: gridOpts }, model); }); var rebind = function () { ko.cleanNode($("#grid")[0]); ko.mapping.fromJS(dataSource, model); ko.applyBindingsToNode($("#grid")[0], { igGrid: gridOpts }, model); }
2) Re-populating the observable array (slower from performance perspective)
ds.removeAll(); ds.push(newRecord); ds.valueHasMutated();
Hope this helps, Martin Pavlov Infragistics, Inc.
My html is something like this:
<div id="results" style="width: 100%; padding:0; height:70vh;"> <!-- ko if: srcArr != undefined --> <table id="gridSrcArr" data-bind="igGrid: { dataSource:srcArr, autoGenerateColumns: true ,primaryKey: 'ViewerProjectID' ,autoAdjustHeight : true, width:'99%', height: '100%', defaultColumnWidth: '320px', features: [{ name: 'Sorting' }, { name: 'Resizing' },{ name : 'Filtering' },{ name : 'Paging' , type : 'local' , pagesize : 10 , pageSizeDropDownLocation : 'inpager' }] }"></table> <!-- /ko --> </div>
and my view model is something like this:
var vm = { srcArr: srcArr
}
now on a button click, I will rewrite the srcArr. what shoukd I do in a case like this?
I'm attaching a working sample for your reference.
Best regards,Martin PavlovInfragistics, Inc.