DataList Web Server Control
in ASP.NET environment,This article describes you how to work with DataList Web
Control.The DataList Web server control can be used to displaying the records from
Database in a customizable format.moreover, for example,we display the records such
as images in the column oriented. You can create templates for items, alternating
items, selected items, and edit items. Header, footer, and separator templates are
also available to let you customize the overall appearance of the DataList.
Binding Data to the DataList
The DataList Web server control can display the Data by bound to the Data Source.
The most common data source can be a SqlDataSource or ObjectDataSource control.
In other hand, you can bind a DataList control to such build-in classes as datasets
, data readers respectively.
Styles
The DataList Web Control can include the Following styles,
- AlternatingItemStyle
- EditItemStyle
- FooterStyle
- HeaderStyle
- ItemStyle
- SelectedItemStyle
- SeparatorStyle
Item Layout
You can control the order, direction, and number of columns for the individual table
cells used to render DataList items. The following table describes the layout options
that are supported by the DataList control.
- Flow layout -In flow layout, list items are rendered inline, as in a word-processing
document.
- Table layout -In table layout, the items are rendered in an HTML table.
- Vertical and horizontal layout -By default, the items in a DataList control
are displayed in a single vertical column. so, you can specify that the control
contain more than one column by This layout.
- Number of columns specifies how many columns that has to present in the Table.
DataList Contorl's Events
The DataList control provides many more events such as ItemCreated, ItemDataBound
and etc. in ItemCreated event, you are able to customize the item-creation process
at run time. The ItemDataBound event also gives you the ability to customize the
DataList control, but after the data is available for inspection.
The following events can be supporting for respond to the Button click, The Buttons
can be a LinkButton, ImageButton and Button
- EditCommand
- DeleteCommand
- UpdateCommand
- CancelCommand
Editing and Selecting Items
The DataList Control allow users to modify the Data in the control. The DataList
control cannot support for the automatic updation with the data source control.
Likewise, The DataList control cannot automatically performe the Paging and sorting
also. for these purposes, you must have to write your own code
The major role of the EditItemTemplate is that provides the appropriate layout and
controls for editing. and you inform the user to edit the Item. The most common
way do this is to include a button in the item template (and if you are using it,
in the AlternatingItemTemplate property), and then set the button's CommandName
property to edit. Then, when the button is clicked, the DataList control automatically
raises the EditCommand event. In the code that you write for the event handler,
set the item to edit mode, which displays the EditItemTemplate.
Displaying and Formatting Data in DataList
for these purposes, you must include the following steps,
- In Web Page,Add a DataList control and use templates to lay out the data that is
displayed by the DataList control.
- Bind the DataList control to a data source.
- Add list of controls within the DataList control
To add DataList control in a Page
- In Design view, Select DataList control from the Data Tab of Toolbox and drag it
into the page
- Right-click the DataList control, and then click Show Smart Tag.
- On the DataList Tasks menu, in the Choose Data Source list, click New Data Source.
- Click Database and specifies Data informations such as sql connection, query,etc
- Click ok
To format the layout in the DataList control
- Right-click the DataList control, click Edit Template, and then click Item Templates.
- Then we specify the styles of Templates such as ItemTemplate,AlternateItemTemplate,etc
- Drag the right-hand resize handle to widen the DataList control so it takes up most
of the page width.
- In Design view, on the DataList control, right-click the title bar, click Edit Template,
and then click Separator Template.
- In the Toolbox, from the HTML group, drag a Horizontal Rule element into the separator
template.
To display related information inside the DataList control
- Right-click the DataList control, click Edit Templates, and then click Item Templates.
- In the Toolbox, from the Standard group, drag a BulletedList control onto the item
template, and then drop the BulletedList control below the category information.
- Right-click the BulletedList control, and then click Show Smart Tag.
- Click Choose Data Source.
- In the Choose Data Source dialog box, in the Select a data source list, click New
Data Source.
- Click Database.
- In the Specify an ID for the data source box, type bulletedListDataSource.
- Click OK.
- In the Which data connection should your application use to connect to the database?
list, click the name of the connection that you created earlier in this walkthrough,
and then click Next.
- Under Specify columns from a table or view, in the Name box, click Products.
- In the Columns box, select the ProductName box.
- Click the WHERE button.
- In the Column list, click CategoryID.
- In the Operator list, click = and In the Source list, click None.
- Click Add, click OK, click Next, and then click Finish.
- In the Select a data field to display in the BulletedList list, click ProductName.
Click OK.
- In the DataList control, right-click the title bar, and then click End Template
Editing.
The following code snippets looks like what one you have created for bulletedListDataSource
control.