I am trying to use TreeGrid's load on demand functionality as described here http://www.igniteui.com/tree-grid/load-on-demand
When the data source is set to a URL, it seems that my only option to pass some data to the server when a node is expanded is to rely on the autogenerated 'path' URL parameter, which lists a chain of row IDs up to the root, and also the node depth URL parameter. Is there any way to add any custom data to these calls besides what the widget does automatically? The data we are displaying is not homogeneous, so row IDs and depths are not sufficient when loading child rows.
Thank you!
Hello,
Thank you for contacting Infragistics!
If you use the igTreeHierarchicalDataSource you can use a customEncodeURlFunc to setup a custom call:
http://help.infragistics.com/jQuery/2015.2/ig.treehierarchicaldatasource#options:settings.treeDS.customEncodeUrlFunc
Hi Mike,
Thank you for pointing that object out. But how do I use it with TreeGrid? I tried something like that, and no call to the server occurs:
var ds = new $.ig.TreeHierarchicalDataSource({ treeDS: { dataSourceUrl: '/Home/GetTreeDataPlain', childDataKey: 'Employees' } }); $treegrid.igTreeGrid({ dataSource: ds, ... }); ds.dataBind();
Note that I got the same TreeGrid working with the following code:
$treegrid.igTreeGrid({ dataSource: '/Home/GetTreeDataPlain', childDataKey: 'Employees', ... });
Thanks again!
Thank you for the update. I have done some looking into this matter and instead of setting the dataSourceUrl you will want to set the dataSource, for example:
var ds = new $.ig.TreeHierarchicalDataSource({ dataSource: '/Home/GetTreeDataPlain', });
Mike,
That partially resolved the issue, although the TreedGrid only loads the first level of nodes. When I expand a node, the console shows a 404 error, as the call is issued to /Home/null?path=... instead of /Home/GetTreeDataPlain?path=...
Here is the code:
var ds = new $.ig.TreeHierarchicalDataSource({ dataSource: '/Home/GetTreeDataPlain' }); $treegrid.igTreeGrid({ dataSource: ds, childDataKey: 'Employees', ... }); ds.dataBind();
Thank you for your patience. I am currently looking into this behavior with my team to see why this happening and how to achieve the intended behavior. I will continue to look into this matter and update you with my progress.
I have done some further looking into this matter and it seems like the datasource is having an issue. As an alternate way to achieve the behavior you can do the following code after you initialize the treeGrid:
$treegrid.data("igTreeGrid").dataSource.settings.treeDS.customEncodeUrlFunc = function (record, expand) { return "/Home/GetTreeDataPlain?stuff='howdy'" }
Thank you! I came up with a pretty much the same solution:
var ds = new $.ig.TreeHierarchicalDataSource({ dataSource: '/Home/GetTreeDataPlain', treeDS: { customEncodeUrlFunc: function (rec, expand) { return '/Home/GetTreeDataPlain?id=' + rec.ID.toString() + '&name=' + rec.LastName; } } }); $treegrid.igTreeGrid({ dataSource: ds, childDataKey: 'Employees', ... }); ds.dataBind();
There is one issue with that, though: the initial call to the server for the root level nodes is issued twice for some reason. (A bug?)
One more question about customEncodeUrlFunc: is there a way to pull the current data level from the rec argument object? It seems that it's present inside that object (__ig_options.dataLevel), but I am not sure how to get that value. As a workaround I subscribed to rowExpanding event where I can pull it from ui.dataLevel and store in an external variable, but it seems like a hackey way of doing things.
Thank you, Mike!
The initial call to the server for the root level data is happening twice because you have you call databind after you setup the igTreeGrid. Like so:
ds.dataBind();
The igTreeGird will call databind itself, you do not need to call it an additional time. Currently there isn’t a way to access the dataLevel from the customEncodeUrlFunc, so the way to do this be to us the rowexpanded/rowexpanding.