TDataList

TDataList is used to display or modify a list of data items specified by its DataSource or DataSourceID property. Each data item is displayed by a data list item which is a child control of the data list. The Items property contains the list of all data list items.

TDataList displays its items in either a Table or Flow layout, which is specified by the RepeatLayout property. A table layout uses HTML table cells to organize the items while a flow layout uses line breaks to organize the items. When the layout is Table, the table's cellpadding and cellspacing can be adjusted by CellPadding and CellSpacing properties, respectively. And Caption and CaptionAlign can be used to add a table caption with the specified alignment. The number of columns used to display the data list items is specified via RepeatColumns property, while the RepeatDirection governs the order of the items being rendered.

Each data list item is created according to one of the seven kinds of templates that developers may specified for a TDataList,

• HeaderTemplate - the template used for displaying content at the beginning of a data list;
• FooterTemplate - the template used for displaying content at the end of a data list;
• ItemTemplate - the template used for displaying every data list item. If AlternatingItemTemplate is also defined, ItemTemplate will be used for displaying item 1, 3, 5, etc.
• AlternatingItemTemplate - the template used for displaying every alternating data list item (i.e., item 2, 4, 6, etc.)
• SeparatorTemplate - the template used for displaying content between items.
• EditItemTemplate - the template used for displaying items in edit mode.
• SelectedItemTemplate - the template used for displaying items in selected mode.

Each of the above templates is associated with a style property that is applied to the items using the template. For example, ItemTemplate is associated with a property named AlternatingItemStyle. Through this property, one can set CSS style fields or CSS classes for the data list items.

Item styles are applied in a hierarchical way. Style in higher hierarchy will inherit from styles in lower hierarchy. Starting from the lowest hierarchy, the item styles include item's own style, ItemStyle, AlternatingItemStyle, SelectedItemStyle, and EditItemStyle. Therefore, if background color is set as red in ItemStyle, EditItemStyle will also have red background color, unless it is explicitly set to a different value.

A data list item can be in normal mode, edit mode or selected mode. Different templates will apply to items of different modes. To change an item's mode, modify EditItemIndex or SelectedItemIndex. Note, if an item is in edit mode, then selecting this item will have no effect.

TDataList provides several events to facilitate manipulation of its items,

• OnItemCreated - raised each time an item is newly created. When the event is raised, data and child controls are both available for the new item.
• OnItemDataBound - raised each time an item just completes databinding. When the event is raised, data and child controls are both available for the item, and the item has finished databindings of itself and all its child controls.
• OnItemCommand - raised when a child control of some item (such as a TButton) raises an OnCommand event.
• command events - raised when a child control's OnCommand event has a specific command name,
  • OnSelectedIndexChanged - if the command name is select.
  • OnEditCommand - if the command name is edit.
  • OnDeleteCommand - if the command name is delete.
  • OnUpdateCommand - if the command name is update.
  • OnCancelCommand - if the command name is cancel.

The following example shows how to use TDataList to display tabular data, with different layout and styles.