Grid Item Detail Status with ComponentRenderer

Flow
1

Helloooo :slight_smile:

I just implemented a grid with a few columns, each rendered with a ComponentRenderer (the “cell-components” which get rendered are created via polymer-templates).
The first column contains a button, which triggers the setDetailsVisible method for the associated item/row.

Now i’m struggelling with the point that the polymer side inside the cell-component never knows if it its inside a opened details row or not.
(I want to change the icon of the button, depending on its state)

Is there a common way to handle that problem?

2

Helloooo Martin!

You can read the grid.isDetailsVisible(item) on your ComponentRenderer implementation to define how the component should be rendered. For example:

grid.addColumn(
    new ComponentRenderer<>(item -> grid.isDetailsVisible(item)
        ? new Button("Close details",
            event -> grid.setDetailsVisible(item, false))
        : new Button("Open details",
            event -> grid.setDetailsVisible(item, true))));

In your custom webcomponent you should have a method to set the icon from the server side, so you can use similar approach.

– Gilberto

3

Hey :slight_smile:

Thanks for your answer - so there is nothing on the client side which tells the cell in the row if the details are visible? like a class in a parent element or else?

So i’d have to set a class manually via java if the details are visible or not?

Thanks

4

Not really, the row doesn’t have anything different on it for when the details row (which is a different element) is opened.

The best way is to add a property in your model that is used when the details row is opened, and then use that property in any other place in the Grid, in a Polymer way.