GXT 4 Grid with Select Tag and Options

GridWithSelectTagTest.java

package com.sencha.gxt.test.client.grid;

import java.io.Serializable;
import java.util.ArrayList;
import java.util.Date;
import java.util.List;

import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.core.client.GWT;
import com.google.gwt.editor.client.Editor.Path;
import com.google.gwt.user.client.ui.RootPanel;
import com.sencha.gxt.core.client.ValueProvider;
import com.sencha.gxt.core.client.util.DateWrapper;
import com.sencha.gxt.data.shared.ListStore;
import com.sencha.gxt.data.shared.ModelKeyProvider;
import com.sencha.gxt.data.shared.PropertyAccess;
import com.sencha.gxt.test.client.grid.selecttag.SelectTagCell;
import com.sencha.gxt.widget.core.client.container.Viewport;
import com.sencha.gxt.widget.core.client.grid.ColumnConfig;
import com.sencha.gxt.widget.core.client.grid.ColumnModel;
import com.sencha.gxt.widget.core.client.grid.Grid;
import com.sencha.gxt.widget.core.client.grid.GridSelectionModel;
import com.sencha.gxt.widget.core.client.grid.GridView;

public class GridWithSelectTagTest implements EntryPoint {

  private static int COUNTER = 0;
  private static final StockProperties props = GWT.create(StockProperties.class);

  @Override
  public void onModuleLoad() {
    Grid<Stock> grid = createGrid();

    Viewport vp = new Viewport();
    vp.add(grid);

    RootPanel.get().add(vp);
  }

  public Grid<Stock> createGrid() {
    ColumnConfig<Stock, String> nameCol = new ColumnConfig<Stock, String>(props.name(), 100, "Company");
    ColumnConfig<Stock, String> symbolCol = new ColumnConfig<Stock, String>(props.symbol(), 100, "Symbol");
    ColumnConfig<Stock, Double> lastCol = new ColumnConfig<Stock, Double>(props.last(), 100, "Last");
    ColumnConfig<Stock, Double> changeCol = new ColumnConfig<Stock, Double>(props.change(), 100, "Change");
    ColumnConfig<Stock, Date> lastTransCol = new ColumnConfig<Stock, Date>(props.lastTrans(), 100, "Last Updated");

    List<ColumnConfig<Stock, ?>> columns = new ArrayList<ColumnConfig<Stock, ?>>();
    columns.add(nameCol);
    columns.add(symbolCol);
    columns.add(lastCol);
    columns.add(changeCol);
    columns.add(lastTransCol);
   
    // Custom Cell
    nameCol.setCell(new SelectTagCell());

    ColumnModel<Stock> columnModel = new ColumnModel<Stock>(columns);

    ListStore<Stock> store = new ListStore<Stock>(props.key());
    store.addAll(getStocks());

    final GridView<Stock> gridView = new GridView<Stock>();
    gridView.setAutoExpandColumn(nameCol);

    GridSelectionModel<Stock> selectioModel = new GridSelectionModel<Stock>();
    
    Grid<Stock> grid = new Grid<Stock>(store, columnModel, gridView);
    grid.setSelectionModel(selectioModel);

    return grid;
  }

  public class Stock implements Serializable {
    private Integer id;
    private Double change;
    private Date date = new Date();
    private String industry = getType();
    private Double last;
    private String name;
    private Double open;
    private String symbol;
    private boolean split = Boolean.valueOf(Math.random() > .5);

    public Stock() {
      this.id = Integer.valueOf(COUNTER++);
    }

    public Stock(String name, String symbol, double open, double last, Date date) {
      this();
      this.name = name;
      this.symbol = symbol;
      this.change = last - open;
      this.open = open;
      this.last = last;
      this.date = date;
    }

    public Double getChange() {
      return change;
    }

    public Integer getId() {
      return id;
    }

    public String getIndustry() {
      return industry;
    }

    public Double getLast() {
      return last;
    }

    public Date getLastTrans() {
      return date;
    }

    public String getName() {
      return name;
    }

    public Double getOpen() {
      return open;
    }

    public double getPercentChange() {
      return getChange() / getOpen();
    }

    public String getSymbol() {
      return symbol;
    }

    public boolean isSplit() {
      return split;
    }

    public void setChange(Double change) {
      this.change = change;
    }

    public void setId(Integer id) {
      this.id = id;
    }

    public void setIndustry(String industry) {
      this.industry = industry;
    }

    public void setLast(Double last) {
      this.last = last;
    }

    public void setLastTrans(Date date) {
      this.date = date;
    }

    public void setName(String name) {
      this.name = name;
    }

    public void setOpen(Double open) {
      this.open = open;
    }

    public void setSplit(boolean split) {
      this.split = split;
    }

    public void setSymbol(String symbol) {
      this.symbol = symbol;
    }

    @Override
    public String toString() {
      return getName();
    }

    private String getType() {
      double r = Math.random();
      if (r <= .25) {
        return "Auto";
      } else if (r > .25 && r <= .50) {
        return "Media";
      } else if (r > .5 && r <= .75) {
        return "Medical";
      } else {
        return "Tech";
      }
    }
  }

  public List<Stock> getStocks() {
    List<Stock> stocks = new ArrayList<Stock>();
    stocks.add(new Stock("a,b,c,d,e,f", "AAPL", 125.64, 123.43, randomDate()));
    stocks.add(new Stock("red,blue,green", "CSCO", 25.84, 26.3, randomDate()));
    return stocks;
  }

  private Date randomDate() {
    DateWrapper w = new DateWrapper();
    int r = (int) (Math.random() * 10) * 10;
    w = w.addDays(-r);
    return w.asDate();
  }

  public interface StockProperties extends PropertyAccess<Stock> {
    @Path("symbol")
    ModelKeyProvider<Stock> key();

    ValueProvider<Stock, String> name();

    ValueProvider<Stock, String> symbol();

    ValueProvider<Stock, Double> last();

    ValueProvider<Stock, Double> change();

    ValueProvider<Stock, Date> lastTrans();

    ValueProvider<Stock, String> industry();
  }

}

SelectTagCell.java

import com.google.gwt.cell.client.AbstractCell;
import com.google.gwt.cell.client.ValueUpdater;
import com.google.gwt.core.client.GWT;
import com.google.gwt.dom.client.Element;
import com.google.gwt.dom.client.NativeEvent;
import com.google.gwt.dom.client.SelectElement;
import com.google.gwt.safehtml.shared.SafeHtml;
import com.google.gwt.safehtml.shared.SafeHtmlBuilder;
import com.google.gwt.safehtml.shared.SafeHtmlUtils;
import com.sencha.gxt.core.client.dom.XElement;

public class SelectTagCell extends AbstractCell<String> {

  public SelectTagCell() {
    // Add events to this to update value
    super("blur");
  }

  /**
   * Allow selection when clicked.
   */
  @Override
  public boolean handlesSelection() {
    return false;
  }

  @Override
  public void onBrowserEvent(Context context, Element parent, String value, NativeEvent event,
      ValueUpdater<String> valueUpdater) {
    super.onBrowserEvent(context, parent, value, event, valueUpdater);

    GWT.log("event.type=" + event.getType());
    
    // only update on blur
    XElement targetEl = event.getEventTarget().cast();
    if (targetEl != null && targetEl.getTagName().equalsIgnoreCase("select")) {
      SelectElement selectEl = targetEl.cast();
      if (selectEl != null) {
        valueUpdater.update(selectEl.getValue());
      }
    }
  }

  @Override
  public void render(Context context, String value, SafeHtmlBuilder sb) {
    String[] options = value.split(",");
    
    SafeHtmlBuilder builder = new SafeHtmlBuilder();
    builder.appendHtmlConstant("<select>");
    for (String option : options) {
      builder.appendHtmlConstant("<option value=\"");
      builder.appendEscaped(option);
      builder.appendHtmlConstant("\">");
      builder.appendEscaped(option);
      builder.appendHtmlConstant("</option>");
    }
    
    builder.appendHtmlConstant("</select>");
    
    sb.append(sanitizeHtml(context, value, sb, builder.toSafeHtml().asString()));
  }

  protected SafeHtml sanitizeHtml(Context context, String value, SafeHtmlBuilder sb, String s) {
    return SafeHtmlUtils.fromTrustedString(s);
  }

  /**
   * Provide the input with a style attribute.
   * 
   * @param value the checked value
   * @param context the cell context
   * 
   * @return styles
   */
  protected String getStyle(Context context, String value) {
    return "";
  }

  /**
   * Provide the input with a class attribute.
   * 
   * @param value the checked value
   * @param context the cell context
   * 
   * @return the class attribute
   */
  protected String getStyleName(Context context, String value) {
    return "";
  }

  /**
   * Provide a label before the input
   */
  protected String getHtmlBefore() {
    return "";
  }

  /**
   * Provide a label after the input
   */
  protected String getHtmlAfter() {
    return "";
  }

}