I am trying to get igTreeGrid working with LoadOnDemand, and it isn't working very good at all. I use TreeHierarchicalDataSource because I want to use customEncodeUrlFunc to add some attributes, but my customEncodeUrlFunc never gets called. The ajax call will get made when the grid is initially loaded, but after it loads the top level clicking the + just makes it starts spinning with no ajax call actually made. I've tried all kinds of things to make it work, but nothing does. Below is the current state of my code.
HTML:
<table id="treeItems">table>
BLOCKED SCRIPT
var dsOptions = {
primaryKey: "key",
dataSource: getDataUrl,
type: "remoteUrl",
treeDS: {
dataSourceUrl: getDataUrl,
childDataKey: "items",
enableRemoteLoadOnDemand: true,
customEncodeUrlFunc: function (data, expand) {
return getDataUrl + "?targetDate=" + encodeURIComponent($("#targetDate").val());
}
};
var ds = new $.ig.TreeHierarchicalDataSource(dsOptions);
var options = {
width: "100%",
//primaryKey: "key",
autoGenerateColumns: false,
dataSource: ds,
//dataSourceType: "json",
//dataSourceUrl: myParam.getDataUrl,
//initialExpandDepth: 1,
columns: [
{ headerText: "Column 1", key: "column1", dataType: "string" },
{ headerText: "Column 2", key: "column2", dataType: "number", width: "*", template: "$${column2}" },
{ headerText: "Column 3", key: "column3", dataType: "number", width: "*", template: "$${column3}" },
{ headerText: "Column 4", key: "column4", dataType: "number", width: "*", template: "$${column4}" },
],
$("#treeItems").igTreeGrid(options);
Hello rsimm,
Did you get any client side error while loading the child layout? Also could you please try using 'dataSourceUrl' option instead of 'dataSource' in the TreeHierarchicalDataSource definition on the root level?
If the problem persists it would be great appreciated if you send me a sample that reproduces the issue and I can run on my side. Thanks in advance.
Regards,
Tsanna
I initially tried dataSourceUrl. When it is used, no AJAX call is made at all. It is thoroughly discussed in this thread.
I have attached a sample.Do you have a sample that uses load on demand from javascript (without using the MVC Helpers) that works?
Thank you for the sample!
I tested it on my side and noticed that the data that you're creating on the server has no hierarchical structure. So the grid cannot be expanded, hence the respective function cannot be invoked. Therefore I modified the sample, so that now the generated data is with hierarchical structure.
Please refer to the attachment for your reference.
If you have any questions, please let me know.
The project that you provided to me earlier was build using ASP.NET MVC. Please note that Load on Demand feature in the treegrid is not dependent on the MVC platform, however if you use it as an endpoint for remote requests, then in order to take advantage of the remote load on demand functionality the controller action method responsible for processing the request should be decorated with TreeGridDataSourceAction attribute. This is all that needs to be done and the TreeGridDataSourceAction is handling everything else for you.
Otherwise you may enable enableRemoteLoadOnDemand option and implement the Load on Demand functionality with any server-side platform that can provide an endpoint to handle the incoming request, it's up to you.
About the customEncodeUrlFunc it won't be called when the grid is initially loaded. It will be called when a data request is made to the server, which happens when expanding child nodes loaded on demand.
More about igTreerGrid Load on Demand feature and customEncodeUrlFunc you can read in the following documentations, for your reference:
- Load on Demand
- customEncodeUrlFunc
If you have any further questions, please let me know.
Thanks, but the sample you made does not work either.
Problems with the sample you provided: