OnDefineRowCssClass - cWebList
Can be implemented to assign custom CSS class names to individual rows
Type: Event
Parameters
| Parameter | Type | Description |
|---|---|---|
| ByRef sCSSClass | String | Name of the CSS class to use |
Syntax
Procedure OnDefineRowCssClass ByRef String sCSSClass
Description
It is possible to assign custom CSS classnames to individual rows. For this, the OnDefineRowCssClass event can be implemented or the sCssClassName member of the tWebRow struct can be used. The psCssClass that is set on the column object is also applied on every cell of that column. Combining these features means that every cell can be individually addressed within the CSS stylesheet.
Sample
Note: the global buffers will have the proper record loaded for a data aware grid.
Object oWebList1 is a cWebList
Object oCustomer_Balance is a cWebColumn
Entry_Item Customer.Balance
Set psCaption to "Balance"
Set piWidth to 50
Set psCSSClass to "DemoColumnBalance"
End_Object
Procedure OnDefineRowCssClass String ByRef sCSSClass
Forward Send OnDefineRowCssClass (&sCSSClass)
If (Customer.Balance < 1000) Begin
Move "DemoRowLow" to sCSSClass
End
Else If (Customer.Balance > 5000) Begin
Move "DemoRowHigh" to sCSSClass
End
Else Begin
Move "DemoRowMedium" to sCSSClass
End
End_Procedure
End_Object
The code example above assigns the custom "DemoColumnBalance" classname to the balance column. Then in OnDefineRowCssClass (executed for each row), it defines a special class based on the customer its balance ("DemoRowLow", "DemoRowMedium" and "DemoRowHigh").
#OWEBAPP .DemoColumnBalance .DemoRowLow {
background-color: red;
}
#OWEBAPP .DemoColumnBalance .DemoRowMedium {
background-color: orange;
}
#OWEBAPP .DemoColumnBalance .DemoRowHigh {
background-color: green;
}
The CSS code above is placed in the Application.css file and changes the background color of the balance column based on the CSS class that is applied to the row.