The following script retrieves reference to the first child of first row in grid.
var firstChildGrid = $('#grid1').igHierarchicalGrid('allChildrenWidgets')[0]; firstChildGrid.dataBind();
what I need is to go down one more level and then dataBind.
Thanks
-Chuck
Hello Chuck,
You can get the second level children widgets as follows:
var firstChildGrid = $('#grid1').igHierarchicalGrid('allChildrenWidgets')[0];
firstChildGrid.dataBind();
var secondLevelGrid = firstChildGrid.childrenWidgets()[0];
secondLevelGrid.dataBind();
I hope this helps. Please let me know if you have further questions on the matter.
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];
But firstChildGrid is undefined.
Thanks in advance for your help
Thank you for the update. Looking forward to seeing the solution.
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?
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.
I'm just following up to see if you need any further assistance with this issue. If so please let me know.