jquery - koGrid empties our grid instead of updating with KnockoutJS with Asp.Net MVC 3 -
we're working on asp.net mvc 3 + knockout-2.1.0 , we're trying render kogrid have ajax issue (we think) emptying kogrid instead of updating it.
in initial state, datasource kogrid array 2 rows, viewmodel (vm):
var viewmodel = function() { var self = this; self.radioselectedoptionvalue = ko.observable('-1'); self.availableactiveproducts = ko.mapping.fromjs(availableactiveproductsobject); }; ko.applybindings(new viewmodel()); availableactiveproducts datasource grid. html:
<div data-bind="kogrid: { data: availableactiveproducts }" /> and grid renders fine initially:

the problem starts here, when radioselectedoptionvalue changes (it radiobutton control change), grid should updated, emptied.

we expect radiobutton update/change knockout subscribe function call:
self.radioselectedoptionvalue.subscribe(function() { $.get('/salesordermanagement/getproductsbyselection', { typecriteria: "g", id: 1, seasontype: "1" }, function(data) { self.availableactiveproducts(data.availableactiveproducts); }); }, this); in controller, method responds ajax call is:
public jsonresult getproductsbyselection(string typecriteria, long id, string seasontype) { var model = _orchestrator.getproductsbyusercriteria(typecriteria, id, seasontype); return json(model, jsonrequestbehavior.allowget); } debugging fiddler, json object returns (with 3 rows expect) grid goes empty after call.

our hypothesis how data set observablearray part problem. how can update render/work properly?
we think we've found else suffering same issue, there no response on ko list: https://groups.google.com/forum/?fromgroups#!topic/knockoutjs/bs4ugqfv14g
here jsfiddle exhibits same behavior: http://jsfiddle.net/wabe/h4zxm/7/
update: solved!
we noted after tyrsius' comment grid refresh after several clicks.
so adding pop , push force refresh (per @keith) makes work, grid updates in expected way. javascript chages to:
self.radioselectedoptionvalue.subscribe(function() { $.get('/salesordermanagement/getproductsbyselection', { typecriteria: "gender", id: 1, seasontype: "inseason" }, function(data) { self.availableactiveproducts(data); self.availableactiveproducts.push({}); self.availableactiveproducts.pop(); }); }, this); the push , pop makes final update/kogrid refresh. keith's fiddle: http://jsfiddle.net/keith_nicholas/myynw/
it looks not updating, if click top columns sort, data appears....
and if push , pop dummy item, code "looks" work expecting
http://jsfiddle.net/keith_nicholas/myynw/
note, took mapping out, don't map initial data, either map both, or neither (depending if want observe changes on actual data elements)
Comments
Post a Comment