Grouping Selection Mode Grid In Ext GWT

Grouping Selection Mode 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.Style.SelectionMode;  
  10. import com.extjs.gxt.ui.client.core.El;  
  11. import com.extjs.gxt.ui.client.data.ModelData;  
  12. import com.extjs.gxt.ui.client.event.Events;  
  13. import com.extjs.gxt.ui.client.event.FieldEvent;  
  14. import com.extjs.gxt.ui.client.event.GridEvent;  
  15. import com.extjs.gxt.ui.client.event.Listener;  
  16. import com.extjs.gxt.ui.client.store.GroupingStore;  
  17. import com.extjs.gxt.ui.client.widget.ContentPanel;  
  18. import com.extjs.gxt.ui.client.widget.LayoutContainer;  
  19. import com.extjs.gxt.ui.client.widget.form.SimpleComboBox;  
  20. import com.extjs.gxt.ui.client.widget.form.ComboBox.TriggerAction;  
  21. import com.extjs.gxt.ui.client.widget.grid.CheckBoxSelectionModel;  
  22. import com.extjs.gxt.ui.client.widget.grid.ColumnConfig;  
  23. import com.extjs.gxt.ui.client.widget.grid.ColumnModel;  
  24. import com.extjs.gxt.ui.client.widget.grid.Grid;  
  25. import com.extjs.gxt.ui.client.widget.grid.GridGroupRenderer;  
  26. import com.extjs.gxt.ui.client.widget.grid.GroupColumnData;  
  27. import com.extjs.gxt.ui.client.widget.grid.GroupingView;  
  28. import com.extjs.gxt.ui.client.widget.layout.FitLayout;  
  29. import com.extjs.gxt.ui.client.widget.layout.FlowLayout;  
  30. import com.extjs.gxt.ui.client.widget.toolbar.LabelToolItem;  
  31. import com.extjs.gxt.ui.client.widget.toolbar.SeparatorToolItem;  
  32. import com.extjs.gxt.ui.client.widget.toolbar.ToolBar;  
  33. import com.google.gwt.dom.client.NodeList;  
  34. import com.google.gwt.i18n.client.DateTimeFormat;  
  35. import com.google.gwt.user.client.Element;  
  36.   
  37. public class CheckGroupingGridExample extends LayoutContainer {  
  38.   
  39.   private GroupingView view;  
  40.   private String checkedStyle = "x-grid3-group-check";  
  41.   private String uncheckedStyle = "x-grid3-group-uncheck";  
  42.     
  43.   @Override  
  44.   protected void onRender(Element parent, int index) {  
  45.     super.onRender(parent, index);  
  46.   
  47.     setLayout(new FlowLayout(10));  
  48.   
  49.     GroupingStore<Stock> store = new GroupingStore<Stock>();  
  50.     store.setMonitorChanges(true);  
  51.     store.add(TestData.getCompanies());  
  52.     store.groupBy("industry");  
  53.   
  54.     final CheckBoxSelectionModel<Stock> sm = new CheckBoxSelectionModel<Stock>() {  
  55.       @Override  
  56.       public void deselectAll() {  
  57.         super.deselectAll();  
  58.         NodeList<com.google.gwt.dom.client.Element> groups = view.getGroups();  
  59.         for (int i = 0; i < groups.getLength(); i++) {  
  60.           com.google.gwt.dom.client.Element group = groups.getItem(i).getFirstChildElement();  
  61.           setGroupChecked((Element)group, false);  
  62.         }  
  63.       }  
  64.   
  65.       @Override  
  66.       public void selectAll() {  
  67.         super.selectAll();  
  68.         NodeList<com.google.gwt.dom.client.Element> groups = view.getGroups();  
  69.         for (int i = 0; i < groups.getLength(); i++) {  
  70.           com.google.gwt.dom.client.Element group = groups.getItem(i).getFirstChildElement();  
  71.           setGroupChecked((Element)group, true);  
  72.         }  
  73.       }  
  74.   
  75.       @Override  
  76.       protected void doDeselect(List<Stock> models, boolean supressEvent) {  
  77.         super.doDeselect(models, supressEvent);  
  78.         NodeList<com.google.gwt.dom.client.Element> groups = view.getGroups();  
  79.         search : for (int i = 0; i < groups.getLength(); i++) {  
  80.           com.google.gwt.dom.client.Element group = groups.getItem(i);  
  81.           NodeList<Element> rows = El.fly(group).select(".x-grid3-row");  
  82.           for (int j = 0, len = rows.getLength(); j < len; j++) {  
  83.             Element r = rows.getItem(j);  
  84.             int idx = grid.getView().findRowIndex(r);  
  85.             Stock m = grid.getStore().getAt(idx);  
  86.             if (!isSelected(m)) {  
  87.               setGroupChecked((Element)group, false);  
  88.               continue search;  
  89.             }  
  90.           }  
  91.         }  
  92.   
  93.       }  
  94.         
  95.       @Override  
  96.       protected void doSelect(List<Stock> models, boolean keepExisting, boolean supressEvent) {  
  97.         super.doSelect(models, keepExisting, supressEvent);  
  98.         NodeList<com.google.gwt.dom.client.Element> groups = view.getGroups();  
  99.         search : for (int i = 0; i < groups.getLength(); i++) {  
  100.           com.google.gwt.dom.client.Element group = groups.getItem(i);  
  101.           NodeList<Element> rows = El.fly(group).select(".x-grid3-row");  
  102.           for (int j = 0, len = rows.getLength(); j < len; j++) {  
  103.             Element r = rows.getItem(j);  
  104.             int idx = grid.getView().findRowIndex(r);  
  105.             Stock m = grid.getStore().getAt(idx);  
  106.             if (!isSelected(m)) {  
  107.               continue search;  
  108.             }  
  109.           }  
  110.           setGroupChecked((Element)group, true);  
  111.             
  112.         }  
  113.       }  
  114.     };  
  115.   
  116.     ColumnConfig company = new ColumnConfig("name""Company"60);  
  117.     ColumnConfig price = new ColumnConfig("open""Price"20);  
  118.     ColumnConfig change = new ColumnConfig("change""Change"20);  
  119.     ColumnConfig industry = new ColumnConfig("industry""Industry"20);  
  120.     ColumnConfig last = new ColumnConfig("date""Last Updated"20);  
  121.     last.setDateTimeFormat(DateTimeFormat.getFormat("MM/dd/y"));  
  122.   
  123.     List<ColumnConfig> config = new ArrayList<ColumnConfig>();  
  124.     config.add(sm.getColumn());  
  125.     config.add(company);  
  126.     config.add(price);  
  127.     config.add(change);  
  128.     config.add(industry);  
  129.     config.add(last);  
  130.   
  131.     final ColumnModel cm = new ColumnModel(config);  
  132.   
  133.     view = new GroupingView() {  
  134.   
  135.       @Override  
  136.       protected void onMouseDown(GridEvent<ModelData> ge) {  
  137.         El hd = ge.getTarget(".x-grid-group-hd"10);  
  138.         El target = ge.getTargetEl();  
  139.         if (hd != null && target.hasStyleName(uncheckedStyle) || target.hasStyleName(checkedStyle)) {  
  140.           boolean checked = !ge.getTargetEl().hasStyleName(uncheckedStyle);  
  141.           checked = !checked;  
  142.           if (checked) {  
  143.             ge.getTargetEl().replaceStyleName(uncheckedStyle, checkedStyle);  
  144.           } else {  
  145.             ge.getTargetEl().replaceStyleName(checkedStyle, uncheckedStyle);  
  146.           }  
  147.   
  148.           Element group = (Element) findGroup(ge.getTarget());  
  149.           if (group != null) {  
  150.             NodeList<Element> rows = El.fly(group).select(".x-grid3-row");  
  151.             List<ModelData> temp = new ArrayList<ModelData>();  
  152.             for (int i = 0; i < rows.getLength(); i++) {  
  153.               Element r = rows.getItem(i);  
  154.               int idx = findRowIndex(r);  
  155.               ModelData m = grid.getStore().getAt(idx);  
  156.               temp.add(m);  
  157.             }  
  158.             if (checked) {  
  159.               grid.getSelectionModel().select(temp, true);  
  160.             } else {  
  161.               grid.getSelectionModel().deselect(temp);  
  162.             }  
  163.           }  
  164.           return;  
  165.         }  
  166.         super.onMouseDown(ge);  
  167.       }  
  168.   
  169.     };  
  170.     view.setShowGroupedColumn(false);  
  171.     view.setForceFit(true);  
  172.     view.setGroupRenderer(new GridGroupRenderer() {  
  173.       public String render(GroupColumnData data) {  
  174.         String f = cm.getColumnById(data.field).getHeader();  
  175.         String l = data.models.size() == 1 ? "Item" : "Items";  
  176.         return "<div class='x-grid3-group-checker'><div class='" + uncheckedStyle + "'> </div></div> " + f  
  177.             + ": " + data.group + " (" + data.models.size() + " " + l + ")";  
  178.       }  
  179.     });  
  180.   
  181.     Grid<Stock> grid = new Grid<Stock>(store, cm);  
  182.     grid.setView(view);  
  183.     grid.setBorders(true);  
  184.     grid.addPlugin(sm);  
  185.     grid.setSelectionModel(sm);  
  186.   
  187.     ContentPanel panel = new ContentPanel();  
  188.     panel.setHeading("Grouping Example");  
  189.     panel.setIcon(Resources.ICONS.table());  
  190.     panel.setCollapsible(true);  
  191.     panel.setFrame(true);  
  192.     panel.setSize(700450);  
  193.     panel.setLayout(new FitLayout());  
  194.     panel.add(grid);  
  195.       
  196.     ToolBar toolBar = new ToolBar();  
  197.     toolBar.add(new LabelToolItem("Selection Mode: "));  
  198.     final SimpleComboBox<String> type = new SimpleComboBox<String>();  
  199.     type.setTriggerAction(TriggerAction.ALL);  
  200.     type.setEditable(false);  
  201.     type.setFireChangeEventOnSetValue(true);  
  202.     type.setWidth(100);  
  203.     type.add("Multi");  
  204.     type.add("Simple");  
  205.     type.setSimpleValue("Multi");  
  206.     type.addListener(Events.Change, new Listener<FieldEvent>() {  
  207.       public void handleEvent(FieldEvent be) {  
  208.         boolean simple = type.getSimpleValue().equals("Simple");  
  209.         sm.deselectAll();  
  210.         sm.setSelectionMode(simple ? SelectionMode.SIMPLE : SelectionMode.MULTI);  
  211.       }  
  212.     });  
  213.   
  214.     toolBar.add(type);  
  215.     toolBar.add(new SeparatorToolItem());  
  216.     panel.setTopComponent(toolBar);  
  217.   
  218.     add(panel);  
  219.   }  
  220.     
  221.   private El findCheck(Element group) {  
  222.     return El.fly(group).selectNode(".x-grid3-group-checker").firstChild();  
  223.   }  
  224.     
  225.   private void setGroupChecked(Element group, boolean checked) {  
  226.     findCheck(group).replaceStyleName(checked ? uncheckedStyle : checkedStyle, checked ? checkedStyle : uncheckedStyle);  
  227.   }  
  228.   
  229. }  

Comments

Popular posts from this blog

Five More Indian Languages - Google Translate

Connect To JioFi Device Without Knowing The Passwords Using WPS