XML Table Grid In Ext GWT Sample Code
- package com.extjs.gxt.samples.client.examples.grid;
- import java.util.ArrayList;
- import java.util.List;
- import com.extjs.gxt.samples.client.Examples;
- import com.extjs.gxt.samples.resources.client.Resources;
- import com.extjs.gxt.ui.client.Style.HorizontalAlignment;
- import com.extjs.gxt.ui.client.data.BaseListLoader;
- import com.extjs.gxt.ui.client.data.HttpProxy;
- import com.extjs.gxt.ui.client.data.ListLoadResult;
- import com.extjs.gxt.ui.client.data.ModelData;
- import com.extjs.gxt.ui.client.data.ModelType;
- import com.extjs.gxt.ui.client.data.XmlLoadResultReader;
- import com.extjs.gxt.ui.client.event.ButtonEvent;
- import com.extjs.gxt.ui.client.event.SelectionListener;
- import com.extjs.gxt.ui.client.store.ListStore;
- import com.extjs.gxt.ui.client.widget.ContentPanel;
- import com.extjs.gxt.ui.client.widget.LayoutContainer;
- 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.ColumnModel;
- import com.extjs.gxt.ui.client.widget.grid.Grid;
- import com.extjs.gxt.ui.client.widget.layout.FitLayout;
- import com.extjs.gxt.ui.client.widget.layout.FlowLayout;
- import com.google.gwt.core.client.GWT;
- import com.google.gwt.http.client.RequestBuilder;
- import com.google.gwt.user.client.Element;
- public class XmlGridExample extends LayoutContainer {
- @Override
- protected void onRender(Element parent, int index) {
- super.onRender(parent, index);
- setLayout(new FlowLayout(10));
- List<ColumnConfig> columns = new ArrayList<ColumnConfig>();
- columns.add(new ColumnConfig("Sender", "Sender", 100));
- columns.add(new ColumnConfig("Email", "Email", 165));
- columns.add(new ColumnConfig("Phone", "Phone", 100));
- columns.add(new ColumnConfig("State", "State", 50));
- columns.add(new ColumnConfig("Zip", "Zip Code", 65));
- // create the column model
- ColumnModel cm = new ColumnModel(columns);
- // defines the xml structure
- ModelType type = new ModelType();
- type.setRoot("records");
- type.setRecordName("record");
- type.addField("Sender", "Name");
- type.addField("Email");
- type.addField("Phone");
- type.addField("State");
- type.addField("Zip");
- // Determine if Explorer or Example for XML path
- String path = GWT.getHostPageBaseURL() + (Examples.isExplorer() ? "" : "../../") + "data/data.xml";
- // use a http proxy to get the data
- RequestBuilder builder = new RequestBuilder(RequestBuilder.GET, path);
- HttpProxy<String> proxy = new HttpProxy<String>(builder);
- // need a loader, proxy, and reader
- XmlLoadResultReader<ListLoadResult<ModelData>> reader = new XmlLoadResultReader<ListLoadResult<ModelData>>(type);
- final BaseListLoader<ListLoadResult<ModelData>> loader = new BaseListLoader<ListLoadResult<ModelData>>(proxy,
- reader);
- ListStore<ModelData> store = new ListStore<ModelData>(loader);
- final Grid<ModelData> grid = new Grid<ModelData>(store, cm);
- grid.setBorders(true);
- grid.setLoadMask(true);
- grid.getView().setEmptyText("Please hit the load button.");
- grid.setAutoExpandColumn("Sender");
- ContentPanel panel = new ContentPanel();
- panel.setFrame(true);
- panel.setCollapsible(true);
- panel.setAnimCollapse(false);
- panel.setButtonAlign(HorizontalAlignment.CENTER);
- panel.setIcon(Resources.ICONS.table());
- panel.setHeading("XML Table Demo");
- panel.setLayout(new FitLayout());
- panel.add(grid);
- panel.setSize(575, 350);
- // add buttons
- Button load = new Button("Load XML", new SelectionListener<ButtonEvent>() {
- public void componentSelected(ButtonEvent ce) {
- loader.load();
- }
- });
- panel.addButton(load);
- add(panel);
- }
- }
Comments
Post a Comment