Grouping Example Grid In Ext GWT

Grouping Example Grid In Ext GWT Sample Code


  1. package com.extjs.gxt.samples.client.examples.grid;  
  2.   
  3. import java.util.ArrayList;  
  4. import java.util.List;  
  5.   
  6. import com.extjs.gxt.samples.resources.client.Resources;  
  7. import com.extjs.gxt.samples.resources.client.TestData;  
  8. import com.extjs.gxt.samples.resources.client.model.Stock;  
  9. import com.extjs.gxt.ui.client.store.GroupingStore;  
  10. import com.extjs.gxt.ui.client.widget.ContentPanel;  
  11. import com.extjs.gxt.ui.client.widget.LayoutContainer;  
  12. import com.extjs.gxt.ui.client.widget.grid.ColumnConfig;  
  13. import com.extjs.gxt.ui.client.widget.grid.ColumnModel;  
  14. import com.extjs.gxt.ui.client.widget.grid.Grid;  
  15. import com.extjs.gxt.ui.client.widget.grid.GridGroupRenderer;  
  16. import com.extjs.gxt.ui.client.widget.grid.GroupColumnData;  
  17. import com.extjs.gxt.ui.client.widget.grid.GroupingView;  
  18. import com.extjs.gxt.ui.client.widget.layout.FitLayout;  
  19. import com.extjs.gxt.ui.client.widget.layout.FlowLayout;  
  20. import com.google.gwt.i18n.client.DateTimeFormat;  
  21. import com.google.gwt.user.client.Element;  
  22.   
  23. public class GroupingGridExample extends LayoutContainer {  
  24.   
  25.   @Override  
  26.   protected void onRender(Element parent, int index) {  
  27.     super.onRender(parent, index);  
  28.     setLayout(new FlowLayout(10));  
  29.   
  30.     GroupingStore<Stock> store = new GroupingStore<Stock>();  
  31.     store.add(TestData.getCompanies());  
  32.     store.groupBy("industry");  
  33.   
  34.     ColumnConfig company = new ColumnConfig("name""Company"60);  
  35.     ColumnConfig price = new ColumnConfig("open""Price"20);  
  36.     ColumnConfig change = new ColumnConfig("change""Change"20);  
  37.     ColumnConfig industry = new ColumnConfig("industry""Industry"20);  
  38.     ColumnConfig last = new ColumnConfig("date""Last Updated"20);  
  39.     last.setDateTimeFormat(DateTimeFormat.getFormat("MM/dd/y"));  
  40.   
  41.     List<ColumnConfig> config = new ArrayList<ColumnConfig>();  
  42.     config.add(company);  
  43.     config.add(price);  
  44.     config.add(change);  
  45.     config.add(industry);  
  46.     config.add(last);  
  47.   
  48.     final ColumnModel cm = new ColumnModel(config);  
  49.   
  50.     GroupingView view = new GroupingView();  
  51.     view.setShowGroupedColumn(false);  
  52.     view.setForceFit(true);  
  53.     view.setGroupRenderer(new GridGroupRenderer() {  
  54.       public String render(GroupColumnData data) {  
  55.         String f = cm.getColumnById(data.field).getHeader();  
  56.         String l = data.models.size() == 1 ? "Item" : "Items";  
  57.         return f + ": " + data.group + " (" + data.models.size() + " " + l + ")";  
  58.       }  
  59.     });  
  60.   
  61.     Grid<Stock> grid = new Grid<Stock>(store, cm);  
  62.     grid.setView(view);  
  63.     grid.setBorders(true);  
  64.   
  65.     ContentPanel panel = new ContentPanel();  
  66.     panel.setHeading("Grouping Example");  
  67.     panel.setIcon(Resources.ICONS.table());  
  68.     panel.setCollapsible(true);  
  69.     panel.setFrame(true);  
  70.     panel.setSize(700450);  
  71.     panel.setLayout(new FitLayout());  
  72.     panel.add(grid);  
  73.     grid.getAriaSupport().setLabelledBy(panel.getHeader().getId() + "-label");  
  74.     add(panel);  
  75.   }  
  76.   
  77. }  

Comments

  1. Thanks for sharing this very interesting grouping.

    ReplyDelete

Post a Comment

Popular posts from this blog

Five More Indian Languages - Google Translate

Connect To JioFi Device Without Knowing The Passwords Using WPS