Data Binding HTML Server Controls
Visual Studio supports data binding for HTML server controls — for example, the HtmlButton and HtmlInputText controls — differently than it does Web server controls such as the DataList, DataGrid, and TextBox controls.
To data bind an HTML server control
- Set the property to bind to a data-binding expression. For details, see Data-Binding Expressions for Web Forms Pages. The expression should resolve to a single value.
You can set HTML server control properties in the Properties window or in HTML view. If you use the Properties window, enter the data-binding expression without quotation marks around it. In HTML view, put quotation marks around the expression.Note If you set the value property of a control such as the HtmlInputText control, the data-binding expression will appear as the control's text or caption at design time. However, at run time the expression will be evaluated and the result will be displayed instead.
The following example shows what an HtmlInputText control might look like in HTML view after you have bound it to an author's name. The binding assumes that the page contains a data view called
DataView1that displays information from an
authorstable. The expression gets the
au_lnamevalue from the first (number zero) record returned by the data view.
<INPUT id="Text1" type="text" name="Text1" runat="server" value='<%# DataBinder.Eval(DataView1, ".au_lname") %>' >
Because the HtmlSelect server control (the HTML Listbox and Dropdown controls) can display multiple records, it supports special data-binding properties and the data-binding procedure is slightly different.
To data bind an HtmlSelect server control
- Set the control's DataSource property to a data-binding expression that resolves to multiple values. For details, see Data-Binding Expressions for Web Forms Pages. A typical value is the name of a dataset instance on your page.
Tip You can set properties in the Properties window or in HTML view. If you use the Properties window, enter them without quotation marks. In HTML view, put quotation marks around the values.
- If the data source contains multiple members (for example, if you are binding to a dataset with multiple tables in it), set the control's DataMember property to the name of the member to use.
- If the member contains multiple fields, set the control's DataTextField property to the name of the field to display. For example, this is often the name of a column in a data table.
- If you want to return a different value than what the user selects (for example, the control displays names but you want to return ID numbers), set the control's DataValueField property.
The following example shows what an HtmlSelect control might look like in HTML view after you have bound it to the authors table in a dataset instance called
DsAuthors1. The control displays the value of the
au_lnamecolumn and when the user makes a selection, it returns the value of the
<SELECT id="Select1" size="2" name="Select1" runat="server" DataSource="<%# DsAuthors1 %>" DataMember="authors" DataTextField="au_lname" DataValueField="au_id"> <OPTION></OPTION> </SELECT>