This use case shows you how to customize the selection of your business objects in a table and in a tree.

How to Customize the Selection in the Tree component

To customize the object selection in the tree component, you should use the "selected" pseudoclass, and define the behavior that you want using the CSS properties that are available for the business objects displayed.

The following example changes the label foreground of the object to red when it is selected:

object {
  labelForeground: black;
}
object:selected {
  labelForeground: red;
}

How to Customize the Selection in the Table component

To customize the object selection in the table component, you should use the "selected" pseudoclass, and define the behavior that you want using the CSS properties that are available for the business objects and attributes displayed.

For example, in a table component that displays network element objects, you can change the color of the label in the Name column using the following CSS extract:

object."ilog.tgo.model.IltObject/name" {
  labelForeground: black;
}
object."ilog.tgo.model.IltObject/name":selected {
  labelForeground: red;
}