User Defined Renderer


Even with variable styles, there are still circumstances where build-in editor and renderer could not cover end-users' special data presentation need. Sigma Grid allow you to denfine editor for inputting and renderer for showing stuff to enhance your customers' satisfication.

Code

Two steps to follow to define a renderer. 

Step One

To denfine an object with a method named paint,which has three parameters. These parameters are passed by Sigma Grid when paint method is invoked.
  • grid - The Sigma Grid self.
  • row - The row where the cell to paint is located.
  • col - The column where the cell to paint is located.
var moneyRenderer = new function(){
    this.paint = function(grid,row,col){
        var coin=row.rowData.p$("coin");
        var data = row.getCellValue(col);
        var n = new Number(data);
        var r ;
        if(!isFinite(n))     n = new Number(0);
        if(col.format!=null) r = n.format(col.format);
        if(coin!=null)    r = coin+r;
        return r;
    }
}


Step Two


To specify the money renderer as price column's render.
var columns = [
...
{name:"price",
          caption:"Price",
          width:120,
          mode:"number",
          format:"#",
          render:moneyRenderer}
];

 

User defined renderer - display

  • Pay attention to the price column.
  • See what happen when editing the price.

 

 

 


All contents are (c) Copyright 2005 - 2007, Sigma Software Inc. All rights Reserved