DataList

The DataList control displays data in a format that you can define using templates and styles. The DataList control is useful for data in any repeating structure, such as a table. The DataList control can display rows in different layouts, such as ordering them in columns or rows.

Note

The DataList control renders items in a list using HTML table elements. To precisely control the HTML that is used to render a list, use the Repeater control instead of the DataList control.

Optionally, you can configure the DataList control to allow users to edit or delete information. You can also customize the control to support other functionality, such as selecting rows.

To add a DataList control to a page

  • Drag the DataList control from the Toolbox panel to your page.

After you add a DataList control, you can specify a data source for the control.

To bind the DataList control to a data source

  1. In Design view, right-click the DataList control, and then click Show Common Control Tasks.

  2. On the Common DropDownList Tasks menu, click an existing data source or <New Data Source...> in the Choose Data Source dropdown.

  3. If you choose <New Data Source...>, configure a new data source in the Data Source Configuration Wizard. For more information, see Configure a data source by using a data bound control.

Customizing the DataList display

The easiest way to customize the DataList display is to use the AutoFormat option.

To apply basic formatting schemes to the DataList control

  1. In Design view, right-click the DataList control, and then click Show Common Control Tasks.

  2. On the Common DataList Tasks menu, click AutoFormat.

  3. In the AutoFormat dialog box, select one of the schemes in the Select a scheme list. The effect of the scheme on your DataList control is displayed in the Preview area.

  4. Click OK to apply the formatting scheme and close the dialog, or Apply to apply the formatting scheme without closing the dialog.

You can use the Property Builder to make more granular design changes to the data displayed in the DataList control.

To use the Property Builder to design the DataList display

  1. In Design view, right-click the DataList control, and then click Show Common Control Tasks.

  2. On the Common DataList Tasks menu, click Property Builder.

  3. In the DataList Properties dialog box, specify general display options, such as header and footer display, number of columns, and layout. You can also specify format and border display options.

  4. You can also customize each of the areas or states of the DataList by updating the collection of styles associated with the area. For example, in the Styles group in the Tag Properties panel, you can customize the RowStyle, HeaderStyle and other collections of styles for an area of the DataList. You can also interactively format the DataList control area templates.

To interactively design the DataList templates

  1. In Design view, right-click the DataList control, and then click Show Common Control Tasks.

  2. On the Common DataList Tasks menu, click Edit Templates. This switches the Wizard into Template Editing Mode.

  3. In the Display dropdown, select the template you would like to edit.

  4. When you are finished designing your templates, on the Common DataList Tasks menu, click End Template Editing to return to the standard DataList design mode.

See also

Concepts

Working with ASP.NET sites
ASP.NET Data controls
DetailsView
FormView
GridView
Repeater

Send feedback about this topic to Microsoft. © 2011 Microsoft Corporation. All rights reserved.