How to Add CSS to Selected Row in Treegrid Gxt 3

how to add css to selected row in treegrid GXT 3

I was also having the same problem, I wanted to color the background of a row depending on some condition. In the end, I found a solution:

You need to create a GridViewConfig and override the getColumnStyle method to return the color want, it took me a while to find out, but overriding the getRowStyle method doesn't do the trick, at least not for me.

grid.getView().setViewConfig(new GridViewConfig<Model>() {

    @Override
    public String getColStyle(  Model model, 
                                ValueProvider<? super Model, ?> valueProvider,
                                int rowIndex, int colIndex)
    {
        if ("Other2".equals(model.getName())){
            return "bold";
        }else if ("Other".equals(model.getName())){
            return "red-row";
        }
        return null;
    }

    @Override
    public String getRowStyle(Model model, int rowIndex) {
        return null;
    }
});

Note: Modify CSS file accordingly.

How to change the color of a particular row in treeGrid

It works exactly like with other jqGrids. Look at the answer. With respect of addClass('...') to <tr> elements the background color can be changed.

GXT: How to set Checkbox TreeGrid item initially checked?

I've figured it out.

The following code should be fired in in Events.ViewReady event of Checkbox TreeGrid, because nodes in tree root won't be rendered before. Then expandAll() is used to render all tree children.
Variable checkedItems contains a List items which you want to be checked on the tree.

be.getTreeGrid().expandAll();
be.getTreeGrid().setCheckedSelection(checkedItems);
be.getTreeGrid().collapseAll();  

---

Related Topics