Difference between revisions of "Custom Renderers and Custom Editors"

Revision as of 00:07, 9 December 2017

Lianja 4.1 provides the ability to specify custom renderers and custom editors for Grid and Form section cells.

In the example below there are two of the grid columns (the Chart and the Employee Details columns) that have a Custom Renderer and one (the Employee Details column) that also has a Custom Editor.

Cell Renderer

You can customise what is displayed inside the grid cells by specifying a Display delegate in the Custom Delegates for the grid columns of a Grid Section or the FormItem of a Form Section.

When the display delegate is called, the record for that particular grid row is active so you can generate dynamic content in the context of that record.

Example code from example_smartgrid App.

////////////////////////////////////////////////////////////////
// Custom display for column 'section1.COLUMN3'
function page1_section1_column3_customdisplay(controlsource,row,col)
{
    var data = [['Key', 'Value'],['Work',11], ['Eat',2], ['Commute',2], ['Watch TV',2], ['Sleep',7]]; 
    var title = "Assignments";   
    dcont = createObject("dcont", "container");
    dcont.raisedshadow = true;
    dcont.layout = "V";
    dcont.backcolor = "white";
    dcont.addObject("labtitle", "label");
    labtitle.fixedheight = 20;
    labtitle.caption = "EMPLOYEE ASSIGNMENTS";  
    labtitle.backcolor = "lightgray";
    labtitle.alignment = "center";
    dcont.addObject("ochart", "chart");
    ochart.charttype = "googlechart.pie"; 
    ochart.charttitle = title;   
    ochart.chartdata = data;
    ochart.chartoptions = "";
    ochart.refresh();
    dcont.fixedheight = 254;
    return dcont;
};

Pro Tip

You could create a timer in the display delegate that when it fires you could update the cell contents in real time when designing dashboards.

Cell Editor

You can customise what is rendered inside the grid cells when editing by specifying an Editor delegate in the Custom Delegates for the grid columns of a SmartGrid or the FormItem cell of a FormGrid.

As with the display delegate, when the editor delegate is called, the record for that particular grid row is active so you can generate dynamic content in the context of that record. This is typically used to render a form dynamically.