Hello Vasya,

Thank you for getting back to me.

Yes, I did follow the Load On Demand Example.

Here is what I am trying to do. Our database has over Million records. We want to take the advantage of SQL Server paging and Load On Demand, so we get the Total Count, then the first 10 records to display. Everything is working so far.
However, I have a requirement to display data in Hierarchy, a Parent record would have two or more GridColumnLayoutModels.

I attached the code sample. Please help

Hello Phong,

Thank you for providing me your sample.

I spent some time investigating and debugging your project further. What I noticed is that there is no Keys set for the child layout and I set them. This is important because when using  GetData method for child layouts path and layout parameters should be defined in order to match the correct layout. If there is no key set for the layout it is being returned as "undefined".

 GridColumnLayoutModel layout = new GridColumnLayoutModel();
 layout.AutoGenerateColumns = false;
 layout.Key = "Histories";

Additionally, there is no ForeignKey set for the child layout. Having ForeignKey set is essential for mapping the data for parent and child level. This is necessary in order to set the correct data for corresponding child level. I added a property in your model, in the ProductHistory class, named ProductID. This property is used to make the connection with the parent level. Since I believe this is just a sample data and in your actual data soure you have a field that could act as a foreign this is what I can recommend to ensure that the child levels are correctly loaded. For example:

public class ProductHistory
{
 public int ProductID { get; set; }
 public string Something { get; set; }
}
.
.
.
 GridColumnLayoutModel layout = new GridColumnLayoutModel();
 layout.AutoGenerateColumns = false;
 layout.Key = "Histories";
 layout.ForeignKey = "ProductID";
 layout.Columns.Add(new GridColumn() { HeaderText = "Something", Key = "Something", DataType = "string" });
 layout.Columns.Add(new GridColumn() { HeaderText = "ProductID", Key = "ProductID", DataType = "number" });
 layout.LoadOnDemand = false;
　
 layout.DataSourceUrl = string.Format("/Home/GetChildren?ajaxUpdateTarget={0}", "History");
 layout.Width = "100%";
gridModel.ColumnLayouts.Add(layout);

I am attaching my modified sample for your reference.

Please have a look at the provided sample and let me know if you need any further assistance with this matter.

Thank you.

I am need have to solution ASAP.

Thanks again for looking into it.

Hello Phong,

I am currently looking into this matter for you. I will get back to you soon with more information or questions for you.

Hi Vasya,

The problem is ProductID information is not enough for me to get the Related Information of the Children. This is what I am trying to do:

1. From the expanding row, get the ProductId, ProductName, and other information. I don't want to go to the database to get the Product based on ProductId. This is not efficient because I have many nested Grids per Product.

2. Filter the Children data with (ProductId, ProductName, and other information)

3. Bind the result to the response

Please help. Thank you

Hello Phong,

I am glad that you find my suggestion helpful.

What I can suggest for achieving your requirement is using GetChildren method. This method parameters will give you enough information to determine which is the current ProductID, respectively which parent row invoked the GetChilden method. Layout parameter contains information about the current layout. Based on these two parameters you could filter your data in order to retrieve only the rows needed for the corresponding child. For example if I am trying to expand first row, Adjustable Race 0, GetChild method will be called with ajaxUpdateTarger="Histories", path: ProductID: 0,layout="Histroies". You could check which layout triggered the event and filter data accordingly and add it to the WrappedGridresponse.

public JsonResult GetChildren(string ajaxUpdateTarget, string path, string layout)
        {
            if (ajaxUpdateTarget == "History")
            {
               //filter your data according to the path and layout and add filtered data to the response
 
                WrappedGridResponse response;
                response = new WrappedGridResponse(histories, null);
                return Json(response, JsonRequestBehavior.AllowGet);
            }
            else
            {
 
               //filter your data according to the path and layout and add filtered data to the response
 
                gridModel.DataSource = something.AsQueryable();
                WrappedGridResponse response;
                response = new WrappedGridResponse(something, null);
                return Json(response, JsonRequestBehavior.AllowGet);
            }
        }
 

I hope you find this information helpful.

Please let me know if you need any further assistance with this matter.