Monday, May 4, 2009

Cell color change in grid

Some of the applications require a different color for a cell to distinguish it from the others. This feature can be achieved using GridCellRenderer and setting the CSS for the cell using config.css which is a parameter for the renderer.

  1: day.setRenderer(new GridCellRenderer<ModelData>(){
  2:     public String render(ModelData model, String property,
  3:       ColumnData config, int rowIndex, int colIndex,
  4:       ListStore<ModelData> store) {
  5:      if(!((String)model.get(colIndex+"adjcode")).equals(""))
  6:       {
  7:        config.css = "x-cell-Color-Change";
  8:        model.set(colIndex+"cellvalue", model.get(colIndex+"adjcode"));
  9:       }else {
 10:        config.css = "";
 11:        if(model.getPropertyNames().contains(colIndex+"deptno2") && !((String)model.get(colIndex+"deptno2")).equals("")) {
 12:         config.css = "x-cell-double";
 13:         model.set(colIndex+"cellvalue", model.get(colIndex+"deptno")+" - "+model.get(colIndex+"shift")+"<br/>"+model.get(colIndex+"deptno2")+" - "+model.get(colIndex+"shift2"));
 14:        }
 15:        else
 16:         model.set(colIndex+"cellvalue", model.get(colIndex+"deptno")+" - "+model.get(colIndex+"shift"));
 17:       }
 18:       return model.get(colIndex+"cellvalue");
 19:      
 20:     }
 21:    });

We need to take care that if the condition is not met we need to remove the CSS style else the CSS is applied to all the rows following that column.

No comments: