Search code examples
ag-gridag-grid-angularag-grid-ng2cellrenderer

Is there a way to pass data between 2 cell renderers in ag grid?

I have 2 cell renderers in 2 coulmns of my ag grid. 1st column is action column. 2nd column is a dropdown containing data options.

Dynamically, based on the selection of data from dropdown in 2nd column, i want to change / toggle the action icons in the 1st column. Is this possible?

I have used cellrendererframework for both cell renderers.

Solution

  • Yes, it is possible!

    First of all, you should add refresh() method to you cell-dropdown.component

    It will look like:

    public refresh(params): boolean {  
    params.api.redrawRows();

    return true;
}

    After new selection have been selected it calls the method refresh() and the first column will redraw

    I have created exapmle with your case:

    We have dropdown of gender and based on changed selection - name of the first column will change

    For gender column is used cellRenderFrameWork

    for the first column (name) is used simple inline cellRender and looks like

      { field: 'name', cellRenderer: params => {
    return params.data.gender === "Female" ? params.value : 'Roman' 
  } },

    enter image description here

    enter image description here

    working example: https://plnkr.co/edit/HT5fgs0VV5PqErWH