PDA

View Full Version : [FIXED] Potential Bug in Grid with Widgets and Expanders



jseriff
12 Jul 2009, 5:20 PM
I seem to be having an issue when combining Widgets and Expanders in a grid. If I remove the widget column, the expander works fine. As a minor side note - the button icon in the widget column does not render in the correct location in hosted mode. It appears to work fine once deployed.

In the example below, I am expecting the expander to come up with a random number in it. In hosted mode, I instead see ${body}. In compiled mode, I see nothing (it fails to expand at all).

I tried to provide a complete example in the code below - you may need to change the icon URL.

This was seen in GWT 1.6.4 on Linux with GXT 2.0 (Release version).




import java.util.ArrayList;
import java.util.List;

import com.extjs.gxt.ui.client.core.XTemplate;
import com.extjs.gxt.ui.client.data.BaseModel;
import com.extjs.gxt.ui.client.store.ListStore;
import com.extjs.gxt.ui.client.widget.Dialog;
import com.extjs.gxt.ui.client.widget.button.Button;
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.grid.GridView;
import com.extjs.gxt.ui.client.widget.grid.RowExpander;
import com.extjs.gxt.ui.client.widget.layout.FitLayout;
import com.google.gwt.user.client.ui.impl.ClippedImagePrototype;

public class FailDialog extends Dialog {
public FailDialog() {
setHeading("Fail Dialog");
setSize(400, 400);
setButtons(Dialog.CLOSE);
setLayout(new FitLayout());
setModal(true);

ListStore<FailModel> store = new ListStore<FailModel>();
for (int i = 0; i < 6; i++) {
store.add(new FailModel());
}

List<ColumnConfig> config = new ArrayList<ColumnConfig>();
XTemplate tpl = XTemplate.create(getExpanderTemplate());
RowExpander expander = new RowExpander();
expander.setTemplate(tpl);
config.add(expander);

config.add(new ColumnConfig("testa", "A", 100));
config.add(new ColumnConfig("testb", "B", 120));

GridCellRenderer<FailModel> editRenderer = new GridCellRenderer<FailModel>() {
public Object render(FailModel model, String property, ColumnData config, int rowIndex, int colIndex, ListStore<FailModel> store, Grid<FailModel> grid) {
Button b = new Button("", new ClippedImagePrototype("images/icons/edit.png", 0, 0, 16, 16));
b.setWidth(20);
return b;
}
};

ColumnConfig editCol = new ColumnConfig("edit", "Edit", 30);
editCol.setRenderer(editRenderer);
config.add(editCol);

final ColumnModel cm = new ColumnModel(config);

GridView view = new GridView();
view.setForceFit(true);

Grid<FailModel> grid = new Grid<FailModel>(store, cm);
grid.setView(view);
grid.addPlugin(expander);
grid.setBorders(true);

add(grid);
}

class FailModel extends BaseModel {
FailModel() {
set("testa", "" + Math.random());
set("testb", "" + Math.random());
set("testc", "" + Math.random());
set("edit", "XYZ");
}
}

private native String getExpanderTemplate() /*-{
var html = [
'<tpl for=".">',
'<p>{testc}</p>',
'</tpl>'
];
return html.join("");

}-*/;
}
Thanks,
Jason

markmacumber
12 Jul 2009, 7:13 PM
I know that this may technically not be an answer for you, but I have certainly had many grid sizing issues myself, I have found that in most cases, you can do something like this to help:


grid.addListener(Events.Render, new Listener<BaseEvent>(){
public void handleEvent(BaseEvent be) {
grid.syncSize();
}
});


which basically synchronises the grid's sizes after if renders itself

sven
13 Jul 2009, 7:21 AM
Fixed in SVN.

hstang
14 Jul 2009, 12:14 PM
Hi,

Is it me or the SVN repository last update is r1619? I haven't seen any new changes since then.

sven
14 Jul 2009, 12:16 PM
Fixes for 2.0 are under "releases/2.0".