PDA

View Full Version : Grid Problem



jamone
2 Dec 2011, 7:50 PM
Hello I am having a problem with displaying data in a grid and the group header.


GridExample.java

package com.foobar.GridExample.client;

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

import com.foobar.GridExample.client.model.GridData;
import com.extjs.gxt.ui.client.GXT;
import com.extjs.gxt.ui.client.store.ListStore;
import com.extjs.gxt.ui.client.widget.LayoutContainer;
import com.extjs.gxt.ui.client.widget.grid.ColumnConfig;
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.HeaderGroupConfig;
import com.extjs.gxt.ui.client.widget.layout.FitLayout;
import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.user.client.Element;
import com.google.gwt.user.client.ui.RootPanel;

/**
* Entry point classes define <code>onModuleLoad()</code>.
*/
public class GridExample implements EntryPoint {

@Override
public void onModuleLoad() {
RootPanel.get().add(new createGrid());
GXT.hideLoadingPanel("loading");
}

private class createGrid extends LayoutContainer {

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

List<ColumnConfig> configs = new ArrayList<ColumnConfig>();
setLayout(new FitLayout());

ColumnConfig column = new ColumnConfig();
column.setId("custPO");
column.setHeader("Cust PO Num");
column.setWidth(309);
configs.add(column);

column = new ColumnConfig();
column.setId("size");
column.setHeader("Size");
column.setWidth(232);
configs.add(column);

column = new ColumnConfig();
column.setId("partNo");
column.setHeader("Part Number");
column.setWidth(147);
configs.add(column);

column = new ColumnConfig();
column.setId("drgNo");
column.setHeader("Drg Number & Rev");
column.setWidth(158);
configs.add(column);

column = new ColumnConfig();
column.setId("quan");
column.setHeader("Quantity");
column.setWidth(117);
configs.add(column);

column = new ColumnConfig();
column.setId("lotNum");
column.setHeader("Lot Number");
column.setWidth(117);
configs.add(column);

column = new ColumnConfig();
column.setId("millSrc");
column.setHeader("Mill Source");
column.setWidth(234);
configs.add(column);

column = new ColumnConfig();
column.setId("millHeatNo");
column.setHeader("Mill Heat No.");
column.setWidth(117);
configs.add(column);

column = new ColumnConfig();
column.setId("spec");
column.setHeader("Specification");
column.setWidth(117);
configs.add(column);

column = new ColumnConfig();
column.setId("batchNo");
column.setHeader("Batch No.");
column.setWidth(117);
configs.add(column);

column = new ColumnConfig();
column.setId("factOrderNo");
column.setHeader("Factory Order No.");
column.setWidth(144);
configs.add(column);

ColumnModel cm = new ColumnModel(configs);

cm.addHeaderGroup(0, 0, new HeaderGroupConfig("<b>FOO BAR LIMITED</b><br>" +
"Street Address 1<br>" +
"Street Address 2<br>" +
"Telephone No. +1 555 555 1212 Fax No. +1 555 555 1213<br>", 4, 11));

ListStore<GridData> store = new ListStore<GridData>();
store.add(new GridData(16533, "5/16\"", "", "", 5000, "511040466", "BAR FOO CO., LTD", "10103045133", "", "61/2844/24", 64438));

Grid<GridData> grid = new Grid<GridData>(store, cm);
grid.setStyleAttribute("borderTop", "none");
grid.getView().setForceFit(true);
grid.setBorders(false);

add(grid);
}
}
}

GridData.java
package com.foobar.GridExample.client.model;

import com.extjs.gxt.ui.client.data.BaseModel;

@SuppressWarnings("serial")
public class GridData extends BaseModel {

public GridData() {

}

public GridData(int data1, String data2, String data3, String data4, int data5,
String data6, String data7, String data8, String data9, String data10, int data11) {
set("custPO", data1);
set("size", data2);
set("partNo", data3);
set("drgNo", data4);
set("quan", data5);
set("lotNum", data6);
set("millSrc", data7);
set("millHeatNo", data8);
set("spec", data9);
set("batchNo", data10);
set("factOrderNo", data11);
}
}


Can someone please spot what I am doing wrong, and suggest corrections. I wish to have my header group span across 4 rows and all 11 columns of my grid.
My header group is appearing on the same row as my column headers instead of above it, also my data is not being rendered in the grid.
The code is attached GridData.java is the model, thanks in advance for your help.
Cheers

Ersmarker
3 Jan 2012, 6:55 AM
Hi.

In you example you don't size the grid, so the height of the data rows are 0. Size the grid and the data will be visible.

I guess you want the text in your header group to be span all your columns and have the "normal" column header shown below?

Change this:


new HeaderGroupConfig(
"<b>FOO BAR LIMITED</b><br>"
+ "Street Address 1<br>"
+ "Street Address 2<br>"
+ "Telephone No. +1 555 555 1212 Fax No. +1 555 555 1213<br>",
1, 11));