I understand your answer, but in trying to implement it appears I may not understand completely how .igHierarchicalGrid('allChildrenWidgets')[0] functions.

Is the subscript [0] and index for which row of the grid to return children for?

If I have a grid that renders 4 rows and on child level for each row. If the third row has been expanded I want to rebind the data.  I thought this syntax would work:

var firstChildGrid = $('#grid1').igHierarchicalGrid('allChildrenWidgets')[2];

firstChildGrid.dataBind();

But firstChildGrid is undefined.

Thanks in advance for your help

-Chuck

Hello,

I am currently working into this and will provide a sample for the option 2 scenario. Thank you for your patience and understanding.

Thank you for the update. Looking forward to seeing the solution.

-Chuck

Hello,

Please refer to my sample that demonstrates how 2) scenario is implemented. It handles the rowExpanding event and calls dataBind for the child grid of the expanding row regardless of the level in the hierarchy.

Please let me know if it meets your requirements. IF you have any further questions, please let me know, I will be glad to help.

Thank you for the example.

My question, In the CheckStatus function how do I get the proper grid reference to call dataBind?

-Chuck

Hello Charles,

 Thank you for your question.

 In order to data bind the grid we will need to get the pressed button first. My suggestion is to use delegate instead of simple 'onClick' function, because in that way we will get 'this' object and from it to get all parents of the button including the grid. Below I am showing how to do this, just change those lines of code and everything will work as you desire.

Code snippet:

1. Template column implementation

columns: [
                        { key: "ID", headerText: "ID" },
                        { key: "Name", headerText: "Product Name"},
                        { key: "Price", headerText: "Price", dataType: "number" },
                        { key: "CheckStatus", headerText: "Check Status", dataType: "string", template: '<input type="button" class= "btn"  Value="Check Status"/>' },
                    ],

2. Delegate function

//check status
   $("body").on("click", ".btn", function(){
    $("#" + $(this).parents().find('table').last().attr('id')).igGrid('dataBind');
   });

 Looking forward to hearing from you.

Hello,

I'm just following up to see if you need any further assistance with this issue. If so please let me know.