ejTreeGrid Questions

[Christopher Hui]

I'm trying to see if the ejTreeGrid is something feasible for me to use.

On load, only the root parents are loaded and are collapsed.

http://js.syncfusion.com/demos/web/#!/bootstrap/treegrid/defaultfunctionalities

In the example above, only "Planning", "Design", and "Implementation Phase" are loaded. Then when you click on "Planning", it's children are retrieved and displayed on the tree grid.

Is this possible? Examples?

[Christopher Hui]

Also, is there a way to define a commands column, similarly to ejGrid?

[Jonesherine Stephen]

Hi Christopher, 

Thanks for contacting Syncfusion support. 

Query1: n the example above, only "Planning", "Design", and "Implementation Phase" are loaded. Then when you click on "Planning", its children are retrieved and displayed on the tree grid. 

Solution: By using “enableCollapseAll” property we can render the TreeGrid with all row collapsed during load time.  

Please find the code example below: 

   $(function () { 

            $("#TreeGridContainer").ejTreeGrid({ 

                enableCollapseAll: true,                 

            }); 

 

        }); 

We have also prepared the sample for your reference. Please find the sample below location:  

Sample: http://www.syncfusion.com/downloads/support/directtrac/general/ze/treegrid-enableCollapse2132849661 

Query2: Also, is there a way to define a commands column, similarly to ejGrid? 

Solution: 

At present there is no support for commands column in ejTreeGrid. Hence we have logged a Feature report “Support for command column in TreeGrid”. This feature can be tracked through our Feature Management.  

It will be implemented in any of our upcoming main release.  

Please let us know if you require further assistance on this.
Regards,  

Jone sherine P S  

[Christopher Hui]

Thanks for the information about the enableCollapseAll.

To reiterate, I do not want to load the entire hierarchy structure. On load, I only want to load the roots, then when a parent node is clicked, an API call is made (preferably in the form of a callback function) to retrieve it's children and those children will be added under the node that was clicked.

Is doing something like that possible?

[Christopher Hui]

Another followup question, if I set allowDragAndDrop to true, is there a way I can invoke a callback function after the item is "dropped"?

[Jonesherine Stephen]

Hi Christopher, 

Please find the response below: 

Query1: To reiterate, I do not want to load the entire hierarchy structure. On load, I only want to load the roots, then when a parent node is clicked, an API call is made (preferably in the form of a callback function) to retrieve its children and those children will be added under the node that was clicked. 

Solution: At present there is no support to load the child elements in Tree Grid on demand. Hence we have logged a feature report “Support for load on Demand for Tree Grid”. It will be implemented in any of our upcoming main release.  

Query2:  if I set allowDragAndDrop to true, is there a way I can invoke a callback function after the item is "dropped"? 

Solution: In TreeGrid “rowDragStop” client side event will be triggered after dragged item gets dropped. 

Please find the code example below: 

            $("#TreeGridContainer").ejTreeGrid({ 

                rowDragStop: function (args) { 

                    //we can perfrom the required action here 

                    alert("row dropped") 

                } 

            }); 

Please find our online documentation for client side events available during row drag and drop action 

https://help.syncfusion.com/api/js/ejtreegrid#events:rowdragstop 

We have also prepared the sample for your reference. Please find the sample from below location 

Sample: http://www.syncfusion.com/downloads/support/directtrac/general/ze/treegrid-rowDragstop-501054517 

Please let us know if you need further assistance on this. 

Regards, 

Jone sherine P S 

[Christopher Hui]

is there a way to detect whether a click on a node is single click or double click?

[Jonesherine Stephen]

Hi Christopher, 

For record single click action “recordClick” event will be triggered whereas for double click/editing action “beginEdit” event will be triggered in Tree Grid. 

Please find the code example: 

$("#TreeGridContainer").ejTreeGrid({                 

                recordClick: function (args) { 

                    //Triggered on single click action 

                    console.log("recordClicked"); 

                }, 

                beginEdit: function (args) { 

                    //Triggered on double click action 

                    console.log("double click"); 

                }, 

            }); 

We have also prepared the sample based on this. Please find the sample from below location 

Sample: http://www.syncfusion.com/downloads/support/directtrac/general/ze/treegrid_node_click2056491980 

Regards, 

Jone sherine P S