Addition of record on click of command button is not working as expected

[pooja kalegowda]

Hi,

I am currently working Treegrid component in Angular. I am using self-referential Data as shown below:

data sample:

{ "ID": 12345, "Name": "H111007",  "NodeType": "project", "status":" approved  " }, 

{ "ID":1696301, "PID":12345, "Name": "PM002", "NodeType": "Package1" }, 

{ "ID":1696331, "PID":12345, "status":" approved  " ,"Name": "PM007", "NodeType": "Package2" }, 

{ "ID":1696340, "PID":12345,"status":" not-approved ", "Name": "PM012", "NodeType": "Package3" }, 

I have used template for displaying first column and the second column is commond column with two buttons one for context menu and one for Add record.

I need to add record on clicking of Add button by providing data from external application code and need to call a separate method in which I have to addrecord with the data provided

and need to see in the treegrid.

This data must pick ID from the row-data on which we have clicked and consume it as ID for the new-data.

I have tried adding it as attached files:

Query1:

How can I get the selected row data on click of button on each row, currently on page refresh if I click on any of the add button. 

I am getting empty array for treeobj.getSeletectedRows() and the node is getting added at the index 0.

but if I select a row first and then click on add button then the node is added below it.

Query2:

PFA the code and let me know how can I solve this issue I need to have the added node as a child hierarchy and the parent should get expand icon next to it.

right now if the editsetting mode is batch and 'newRowPosition' is child but the node is not getting added as a child jus getting added below it but not with hierarchy.

Query3:

how can we stop expanding the complete view before rendering I have only one root node I need to expand only that and not its child or grandchild while rendering at starting.

PFB for the view:

On first click on 3rd row the row is added at top

But on second click on 3rd row the row is added below, but I need it as a child of that particular node.

Kindly Let me know how to proceed further for my requirement.

Regards,

Pooja K

Attachment: AddItemTreegrid_fb0655ce.zip

[Farveen Sulthana Thameeztheen Basha]

Hi Pooja, 

Thanks for contacting Syncfusion Support. 

Query#:- how can we stop expanding the complete view before rendering I have only one root node I need to expand only that and not its child or grandchild while rendering at starting. 

 

We have achieved this requirement using dataBound of the TreeGrid. In this event, we have expanded level 0 records(i.e top level parents) using expandAtLevel(0) method  on  Initial load. Also we have used enableCollapseAll property to render TreeGrid parent rows in Collapsed state.  

Refer to the code below:- 

App.Component.html:- 

<ejs-treegrid #treegrid [dataSource]='data' height='100' [toolbar]='toolbar' allowPaging='true  [enableCollapseAll]=true (dataBound)="dataBound($event)"> 

    <e-columns> 

        <e-column field='taskID' headerText='Task ID' width='80' textAlign='Right'></e-column> 

            .     .  .  

    </e-columns> 

  </ejs-treegrid> 

 

App.Component.ts 

 

  dataBound(args) { 

      this.treegridInstance.expandAtLevel(0); 

   } 

  

 

Note:- You can use enableCollapseAll property directly at TreeGrid Initialization.  

 

Refer to the API link:- 

https://ej2.syncfusion.com/angular/documentation/api/treegrid/#expandatlevel 

https://ej2.syncfusion.com/angular/documentation/api/treegrid/#databound 

https://ej2.syncfusion.com/angular/documentation/api/treegrid/#enablecollapseall 

Query#:- Add newrecord dynamically as Child in Batch Editmode. 

 

We are able to replicate the reported problems at our end. Also we will check for the feasibility to add the records(with particular RowPosition) dynamically in Batch Mode and update you further details by 1^st June 2021. 

 

Until then we appreciate your patience. 

Regards, 

Farveen sulthana T 

 

 

[Farveen Sulthana Thameeztheen Basha]

Hi Pooja,  

We appreciate your patience. 

Query#:- Add newrecord dynamically as Child in Batch Editmode.  

Further analyzing In order to achieve your requirement “For adding new records dyanamically with newRowPostion” we have planned to implement this as improvement “batchUpdate method with newRowPosition support”. While using batchUpdate method, records will be saved directly without showing the batchChanges in UI level.  

 

So please confirm whether the above behavior satisfy your requirement. Based on your confirmation we will provide you further details about this. 

 Regards, 

Farveen sulthana T