The DataList control displays data items in a repeating list, and optionally supports selecting and editing the items. The content and layout of list items in DataList is defined using templates. At a minimum, every DataList must define an ItemTemplate; however, several optional templates can be used to customize the appearance of the list. The following table describes those templates.

Templates define the HTML elements and controls that should be displayed for an item, as well as the layout of these elements. Style formatting -- font, color, and border attributes -- is set via styles. Each template has its own style property. For example, styles for the EditItemTemplate are set through the EditItemStyle property.

A third set of properties affect the overall rendering of DataList. By default, DataList items render within a table as a single vertical column. Setting the RepeatLayout property to Flow removes the HTML table structure from the rendering of the list.

DataList supports directional rendering through the RepeatDirection property, meaning it can render its items horizontally or vertically. Since page width is the dimension that the developer must control in Web user interface, DataList permits the developer to control the number of "columns" that are rendered (RepeatColumns), regardless of whether the items are rendered horizontally or vertically.

If RepeatDirection is Horizontal and RepeatColumns is five, the items are rendered in rows containing five columns.

If RepeatDirection is Vertical, and RepeatColumns remains set to five, the items are rendered in five columns, each equal in length to the total number of items divided by five.

The following sample illustrates using a simple DataList control.

VB DataList1.aspx [Run Sample] | [View Source]

The EditItemTemplate interacts with another property: EditItemIndex. By default, the value of EditItemIndex is -1, meaning none of the items in the list is being edited. When EditItemIndex is set to a particular item, that item is displayed using the EditItemTemplate.

The DataList also supplies three events that can be used to support editing. EditCommand is thrown when an "edit" command button control is clicked within the list's ItemTemplate. It's up to you to handle this event in your code. The typical logic sets EditItemIndex to the selected item, and then rebinds the data to the DataList as shown in the following example.

Protected Sub DataList_EditCommand(Source As Object, e As DataListCommandEventArgs)
    DataList1.EditItemIndex = CType(e.Item.ItemIndex, Integer)
    BindList()
End Sub

The EditItemTemplate typically contains "update" and "cancel" command buttons. These buttons cause the UpdateCommand and CancelCommand events to be thrown, respectively. It's up to you to handle these events in your code. The typical logic for "cancel" sets EditItemIndex to -1, and then rebinds the data to the DataList as shown in the following example.

Protected Sub DataList_CancelCommand(Source As Object, e As DataListCommandEventArgs)
    DataList1.EditItemIndex = -1
    BindList()
End Sub

The typical logic for "update" updates the data source, sets EditItemIndex to -1, and then rebinds the data to the DataList. The following sample illustrates editing items in DataList.

VB DataList3.aspx [Run Sample] | [View Source]