TreeGrid with checkbox functionality

[dhphuoc]

Hi,

I am trying to implement the checkbox functionality on a TreeGrid, so that it'll behave somewhat similarly as a checkable TreePanel. I am aware that GXT v3.0 will have the tri-state checkbox TreeGrid as a few feature, but I still need to implement this feature for now unfortunately. I try to override the TreeGridCellRenderer and pass <true> to the getTemplate() call as shown below. The checkboxes render correctly, however, they don't seem to accept the mouse events. I check and un-check the boxes but they are not visually changing their state accordingly. Does anyone know what I am missing? Also, if you know some high-level steps to implement this feature, your sharing/feedback is appreciated. Thanks.

	    ColumnConfig name = new ColumnConfig("name", "Name", 100);
	    name.setRenderer(new TreeGridCheckboxCellRenderer<ModelData>());

public class TreeGridCheckboxCellRenderer<M extends ModelData> extends TreeGridCellRenderer<M> {
    @SuppressWarnings({"unchecked", "rawtypes"})
    public Object render(M model, String property, ColumnData config, int rowIndex, int colIndex, ListStore<M> store,
        Grid<M> grid) {
        config.css = "x-treegrid-column";

        assert grid instanceof TreeGrid : "TreeGridCellRenderer can only be used in a TreeGrid";

        TreeGrid tree = (TreeGrid) grid;
        TreeStore ts = tree.getTreeStore();

        int level = ts.getDepth(model);

        String id = getId(tree, model, property, rowIndex, colIndex);
        String text = getText(tree, model, property, rowIndex, colIndex);
        AbstractImagePrototype icon = calculateIconStyle(tree, model, property, rowIndex, colIndex);
        Joint j = calcualteJoint(tree, model, property, rowIndex, colIndex);

        return tree.getTreeView().getTemplate(model, id, text, icon, true, j, level - 1);
    }
}

[sven]

As you said the feature is not implemented. You also need to add support for the clicking, not just setting to true to render a checkbox

[dhphuoc]

I think I know what's involved in implementing this feature now. It seems like a lot of changes. Will give it a try. Thanks sven.

[david.ln]

I'm currently using a treegrid with checkbox selection model.
I did not override the onRender, but the handleMouseDown method and it is working as expected, however it is ugly...

Note that my tree actually displays PMAWbs object type, that is specific to my project.
Also note that I replaced the standard joint icon by +/- icones. I'm using it to check if the click was done on expand/collapse icon or elsewhere on the tree.

@Override
        protected void handleMouseDown(GridEvent<PMAWbs> e) {
            
            if (e.getEvent().getButton() == Event.BUTTON_LEFT && 
                (!e.getTarget().getClassName().equals(" x-tree3-node-joint") && 
                 !e.getTarget().getParentElement().getClassName().equals(" x-tree3-node-joint"))) { // class of the expand/collapse
                
                PMAWbs wbs = e.getModel();
                if(wbs != null) {
                       //here I have some conditions that may refuse the selection
                        return;
                    }

                    // fire the selection change
                    // note that I had to retain selected elements in local list, else when
                    // collapsing/expanding the selection is lost. So I use this list here to know if
                    // I need to select or unselect
                    onSelectChange(wbs, !selectedElements.contains(wbs.getWbsId()));

                }
                
            }

Hope that helps