Current Grid Instance on Cell Edit

Question

I am looking at finding the current grid instance based on cell i am editing. I have Parent/Child grid. and my code looks something like this. on each edit i want to query some data and based on value i want to set cell color.

let Columns:any=this.currentChlidGrid.getColumns(false);
           var colIndex = Columns.find(x => x.field==currentColumn).index;  
           if(bookedVal> 1.05 && bookedVal <= 1.09){
            this.highlightcell(this.currentChlidGrid.element.id,rowIndex,colIndex,"yellow");         
           }else if(bookedVal>1.10){
            this.highlightcell(this.currentChlidGrid.element.id,rowIndex,colIndex,"red");         
           }

Ajith Govarthan · Accepted Answer

Hi PDev, 

Thanks for contacting Syncfusion support. 

Based on your query, you want to access the child grid component instance while editing the cell in the Grid component. So, we have prepared sample in that we have used the cellEdit event to achieve your requirement. In the cellEdit event to we have used the parentsUntil method to get the child grid instance from the target cell. For your convenience, we have attached the sample, please refer them for your reference. 

Code Example: 




App.component.ts 

  cellEdit: (args) => { 
        var gridEle = parentsUntil(args.cell, 'e-grid', false); // queryselect the child grid element 
        if (gridEle) { 
          var childInstance = gridEle.ej2_instances[0]; 
          console.log(childInstance); 
        } 
      }, 

Sample Link: https://stackblitz.com/edit/angular-lkwq9z?file=app.component.ts 

Please get back to us if you need further assistance. 

Regards, 
Ajith G.