Refresh a row after CRUD

[mamadou]

hello,

how to refresh and expand a specific row in a treegrid  after a CRUD.

the datasource of treegrid is a type remote data:

this.dataTree = new DataManager( DataMangerOption.getTreeDataManger({},

Compte.ENDPOINT_PLURAL,['code', 'name', 'id', 'level(id)',

'affiliateAccount','budgetLine'],

Compte.ENDPOINT_PLURAL, 'affiliateAccount',{

sort: 'code,asc',

filter: ` (level.project.uid;${Operator.EQUAL};'${id}')`

}),

);

[Manivannan Padmanaban]

Hi Mamadou, 

Greetings from Syncfusion Support. 

From the shared query, we are able to understand that you want to expand the specific row after CRUD action. Using expandRow method of Tree Grid in actionComplete event we have achieved your requirement. Refer to the below code example, 

<ejs-treegrid #treegrid  

[dataSource]='data' (actionComplete) ="Complete($event)" [treeColumnIndex]='1'> 

  <e-columns> 

………………… 

  </e-columns> 

</ejs-treegrid> 

  

import { Component, ViewChild, ViewEncapsulation, OnInit, Inject } from "@angular/core";import { Column, EditSettingsModel, ToolbarItems, TreeGridComponent } from "@syncfusion/ej2-angular-treegrid";……………………. ………………export class FetchDataComponent {…………………….  @ViewChild('treegrid')  public treegrid: TreeGridComponent;     Complete = function (args: any) {    if (args.requestType === 'save') { // check the request type here.      this.treegrid.expandRow(this.treegrid.getRowByIndex(0)) // pass your desire row here using index.    }  }    }

Also, refer to the below API links. 

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

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

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

Regards, 

Manivannan Padmanaban 

[mamadou]

Hello,

Thanks for your feedback

it is possible to refresh a specifique row of treegrid?

I would like to refresh only one line instead of treegrid.

[Manivannan Padmanaban]

Hi Mamadou, 

Thanks for the update. 

Using updateRow method of tree grid, we can able to refresh the specific row. Refer to the below code example, 

<ejs-treegrid #treegrid ……..' 

……………. (actionComplete) ="Complete($event)" [treeColumnIndex]='1'> 

  <e-columns> 

    <e-column field='TaskID' headerText='Task ID' isPrimaryKey=true width='150'></e-column> 

    <e-column field='TaskName' headerText='Task Name' width='150'></e-column> 

    ………….. 

  </e-columns> 

</ejs-treegrid> 

export class FetchDataComponent {  ………….  @ViewChild('treegrid')  public treegrid: TreeGridComponent;………….   Complete = function (args: any) {    if (args.requestType === 'save') {………………………..      var data = this.treegrid.getCurrentViewRecords()[1] // get the desire data from current view records using index value.      data.taskName = "update"; // do the changes.      this.treegrid.updateRow(1, data); // modify the specific row using updateRow method by passing index and modified data.    }  }    }

Also, refer the below API link. 

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

If your requirement is not fulfilled by the shared solution, please get back to us with the thorough explanation that will help us achieve your requirement as soon as possible. 

Regards, 

Manivannan Padmanaban