[GXT 2.2.4] Bug on GridCellRenderer for TreeGrid

[keyade]

Hi,
I have some issues on widget renderer when I try to scroll with the mouse wheel.
Some widgets are not rerendering correctly.

here is a simple source code producing the bug :

import java.util.Arrays;
import com.extjs.gxt.samples.resources.client.Resources;
import com.extjs.gxt.samples.resources.client.TestData;
import com.extjs.gxt.samples.resources.client.model.Folder;
import com.extjs.gxt.ui.client.data.ModelData;
import com.extjs.gxt.ui.client.store.ListStore;
import com.extjs.gxt.ui.client.store.TreeStore;
import com.extjs.gxt.ui.client.widget.ContentPanel;
import com.extjs.gxt.ui.client.widget.LayoutContainer;
import com.extjs.gxt.ui.client.widget.form.CheckBox;
import com.extjs.gxt.ui.client.widget.grid.ColumnConfig;
import com.extjs.gxt.ui.client.widget.grid.ColumnData;
import com.extjs.gxt.ui.client.widget.grid.ColumnModel;
import com.extjs.gxt.ui.client.widget.grid.Grid;
import com.extjs.gxt.ui.client.widget.grid.GridCellRenderer;
import com.extjs.gxt.ui.client.widget.layout.FitLayout;
import com.extjs.gxt.ui.client.widget.layout.FlowLayout;
import com.extjs.gxt.ui.client.widget.treegrid.TreeGrid;
import com.extjs.gxt.ui.client.widget.treegrid.TreeGridCellRenderer;
import com.google.gwt.user.client.Element;

public class TreeGridExample extends LayoutContainer {

    @Override
    protected void onRender( Element parent, int index ) {
        super.onRender( parent, index );
        setLayout( new FlowLayout( 10 ) );

        Folder model = TestData.getTreeModel();

        TreeStore<ModelData> store = new TreeStore<ModelData>();
        for ( int i = 0; i < 10; i++ ) {
            store.add( model.getChildren(), true );
        }

        ColumnConfig cBox = new ColumnConfig( "cBox", "cBox", 20 );
        cBox.setRenderer( new GridCellRenderer<ModelData>() {

            @Override
            public Object render( ModelData model, String property, ColumnData config, int rowIndex, int colIndex,
                    ListStore<ModelData> store, Grid<ModelData> grid ) {
                final CheckBox checkBox = new CheckBox();
                checkBox.setValue( rowIndex % 2 == 1 );
                return checkBox;
            }

        } );
        ColumnConfig name = new ColumnConfig( "name", "Name", 100 );
        name.setRenderer( new TreeGridCellRenderer<ModelData>() );
        ColumnModel cm = new ColumnModel( Arrays.asList( cBox, name ) );

        ContentPanel cp = new ContentPanel();
        cp.setLayout( new FitLayout() );
        cp.setSize( 600, 300 );

        final TreeGrid<ModelData> tree = new TreeGrid<ModelData>( store, cm );
        tree.getStyle().setLeafIcon( Resources.ICONS.music() );
        tree.setAutoExpandColumn( "name" );

        cp.add( tree );

        add( cp );
    }

}

The result optained :

screen_bug_treegrid.png

Thank you

[delrius]

I am having the same problems with Widget Renderer TreeGrid. Like in example (you can see the attachement) I created custom renderer for my grid. But after some operations (i.e. open all leaves and start collapsing-expanding them) some widgets get lost and not displayed.

[Alexandru82]

Same problem on ie (works fine on firefox)!!! to gwt developpers is passed almost 2 months and no answear!

[sven]

It is on the list and will be worked on for one of the upcomming releases.

[Alexandru82]

Thank you very much!

[delrius]

This code seemed to fix the issue

grid.getTreeView().setBufferEnabled(false);

No un-displayed widgets in grid, but I doubt it's the good solution in performance aspect.

[sven]

If performance is relevant, you should not use widgets in a Grid at all. Try to use plain html instead.

[Alexandru82]

The problem seems to be that in IE when you scroll/filter it makes getWidget()... For some reason the widget already build gets a bad html. So, for the moment the problem is solved by rebuilding the widget everytime (checkbox in my case) with listeners and everything. It's not so good for performance but it seems more stable. Will see what the tests in time will give.

[keyade]

Actually I've got this problem on firefox.
I also had it on a grid.

[sven]

Its a bug in BufferView. Please try this patch:

Index: user/src/com/extjs/gxt/ui/client/widget/grid/BufferView.java===================================================================
--- user/src/com/extjs/gxt/ui/client/widget/grid/BufferView.java	(revision 2479)
+++ user/src/com/extjs/gxt/ui/client/widget/grid/BufferView.java	(working copy)
@@ -335,7 +335,7 @@
         if (!isRowRendered(i)) {
           List<ModelData> list = new ArrayList<ModelData>();
           list.add(store.getAt(i));
-          widgetList.add(i, new ArrayList<Widget>());
+          widgetList.set(i, new ArrayList<Widget>());
           String html = doRender(cs, list, i, cc, stripe, true);
           getRow(i).setInnerHTML(html);
           renderWidgets(i, i);