[jrwahlParticipant]

Here’s how I implemented an expand/collapse all. You’ll notice that the functions are not hard coded to any particular tree grid, and instead accept the id of whatever tree grid you want to expand/collapse. Also note that you’ll need to replace “rowId” with whatever id you have set for your data (id: ‘rowId’).

          $("#expandAllButton").jqxButton({});
           $('#expandAllButton').click(function () {
               expandAllTreeGrid("treeGrid");
           });
           $("#collapseAllButton").jqxButton({});
           $('#collapseAllButton').click(function () {
               collapseAllTreeGrid("treeGrid");
           });

            // These methods receive the id of the treeGrid to work with.
            function expandAllTreeGrid(treeGridId) {
               traverseTreeGrid(treeGridId,"expand");
            }
            function collapseAllTreeGrid(treeGridId) {
               traverseTreeGrid(treeGridId,"collapse");
            }
            function traverseTreeGrid(treeGridId, action) {
               var treeGrid = "$(\"#" + treeGridId + "\")";
               var rows = eval(treeGrid).jqxTreeGrid('getRows');
                for(var i = 0; i < rows.length; i++) {
                    if (rows[i].records) {
                        if (action == "expand") {
                           eval(treeGrid).jqxTreeGrid('expandRow',rows[i].rowId);
                        } else if (action == "collapse") {
                           eval(treeGrid).jqxTreeGrid('collapseRow',rows[i].rowId);
                        }
                        traverseTree(rows[i].records);
                    }
                }
            };

[Author]

Posts