FormView Example, FormView Control in ASP.NET 2.0 Tutorial

Displays the values of a single record from a data source using user-defined templates. The FormView control allows you to edit, delete, and insert records.



A few of the more important properties deserve attention as the following list provides.

• AllowPaging: A Boolean value signaling whether users can page through the records from the assigned data source. If set to true, the default paging system of numbers (1 through the number of records) is displayed at the bottom of the record displayed. The paging links may be customized via the various pager properties available.
• DataKeyNames: The key fields from the data source.
• DataSourceID: The ID of the data source element used to populate the FormView control. This would correspond to the id assigned to the SqlDataSource element if SQL Server is used.
• DefaultMode: Allows you to specify the default behavior for the control. That is, how it is first displayed when accessed by a user. The possible values include ReadOnly, Insert, and Edit.
• EmptyDataText: The text to be displayed when empty data values are encountered.

With the FormView control declared, its contents must be formatted accordingly. Its data is presented via templates. There are five main templates to be used with the FormView control:

• ItemTemplate: Controls the presentation when the data is viewed by the user.
• EditItemTemplate: Determines the formatting and display of data elements when the record is being edited by the user. Within this template, you will use other controls like TextBox elements to allow users to edit values.
• InsertItemTemplate: Similar to editing a record, this template controls the display of fields allowing a user to add a new record to the backend data source. Since new values are entered, the users should be allowed to freely type text or restrict to certain values according to data requirements.
• FooterTemplate: Determines what, if anything, is displayed in the footer portion of the table rendered for the FormView control.
• HeaderTemplate: Determines what, if anything, is displayed in the header portion of the FormView table.

<asp:FormView
AccessKey="string"
AllowPaging="True|False"
BackColor="color name|#dddddd"
BackImageUrl="uri"
BorderColor="color name|#dddddd"
BorderStyle="NotSet|None|Dotted|Dashed|Solid|Double|Groove|Ridge|
Inset|Outset"
BorderWidth="size"
Caption="string"
CaptionAlign="NotSet|Top|Bottom|Left|Right"
CellPadding="integer"
CellSpacing="integer"
CssClass="string"
DataKeyNames="string"
DataMember="string"
DataSource="string"
DataSourceID="string"
DefaultMode="ReadOnly|Edit|Insert"
EmptyDataText="string"
Enabled="True|False"
EnableTheming="True|False"
EnableViewState="True|False"
Font-Bold="True|False"
Font-Italic="True|False"
Font-Names="string"
Font-Overline="True|False"
Font-Size="string|Smaller|Larger|XX-Small|X-Small|Small|Medium|
Large|X-Large|XX-Large"
Font-Strikeout="True|False"
Font-Underline="True|False"
FooterText="string"
ForeColor="color name|#dddddd"
GridLines="None|Horizontal|Vertical|Both"
HeaderText="string"
Height="size"
HorizontalAlign="NotSet|Left|Center|Right|Justify"
ID="string"
OnDataBinding="DataBinding event handler"
OnDataBound="DataBound event handler"
OnDisposed="Disposed event handler"
OnInit="Init event handler"
OnItemCommand="ItemCommand event handler"
OnItemCreated="ItemCreated event handler"
OnItemDeleted="ItemDeleted event handler"
OnItemDeleting="ItemDeleting event handler"
OnItemInserted="ItemInserted event handler"
OnItemInserting="ItemInserting event handler"
OnItemUpdated="ItemUpdated event handler"
OnItemUpdating="ItemUpdating event handler"
OnLoad="Load event handler"
OnModeChanged="ModeChanged event handler"
OnModeChanging="ModeChanging event handler"
OnPageIndexChanged="PageIndexChanged event handler"
OnPageIndexChanging="PageIndexChanging event handler"
OnPreRender="PreRender event handler"
OnUnload="Unload event handler"
PageIndex="integer"
PagerSettings-FirstPageImageUrl="uri"
PagerSettings-FirstPageText="string"
PagerSettings-LastPageImageUrl="uri"
PagerSettings-LastPageText="string"
PagerSettings-Mode="NextPrevious|Numeric|NextPreviousFirstLast|
NumericFirstLast"
PagerSettings-NextPageImageUrl="uri"
PagerSettings-NextPageText="string"
PagerSettings-PageButtonCount="integer"
PagerSettings-Position="Bottom|Top|TopAndBottom"
PagerSettings-PreviousPageImageUrl="uri"
PagerSettings-PreviousPageText="string"
PagerSettings-Visible="True|False"
runat="server"
SkinID="string"
Style="string"
TabIndex="integer"
ToolTip="string"
Visible="True|False"
Width="size"
>
<EditItemTemplate>
<!-- child controls -->
</EditItemTemplate>
<EditRowStyle />
<EmptyDataRowStyle />
<EmptyDataTemplate>
<!-- child controls -->
</EmptyDataTemplate>
<FooterStyle />
<FooterTemplate>
<!-- child controls -->
</FooterTemplate>
<HeaderStyle />
<HeaderTemplate>
<!-- child controls -->
</HeaderTemplate>
<InsertItemTemplate>
<!-- child controls -->
</InsertItemTemplate>
<InsertRowStyle />
<ItemTemplate>
<!-- child controls -->
</ItemTemplate>
<PagerSettings
FirstPageImageUrl="uri"
FirstPageText="string"
LastPageImageUrl="uri"
LastPageText="string"
Mode="NextPrevious|Numeric|NextPreviousFirstLast|
NumericFirstLast"
NextPageImageUrl="uri"
NextPageText="string"
OnPropertyChanged="PropertyChanged event handler"
PageButtonCount="integer"
Position="Bottom|Top|TopAndBottom"
PreviousPageImageUrl="uri"
PreviousPageText="string"
Visible="True|False"
/>
<PagerStyle />
<PagerTemplate>
<!-- child controls -->
</PagerTemplate>
<RowStyle />
</asp:FormView>

<%@ Page language="C#" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html >
<head runat="server">
<title>FormView Example</title>
</head>
<body>
<form id="form1" runat="server">

<h3>FormView Example</h3>

<asp:formview id="StudentFormView"
datasourceid="StudentSource"
allowpaging="true"
datakeynames="StudentID"
runat="server">

<itemtemplate>

<table>
<tr>
<td>
<asp:image id="StudentImage"
imageurl='<%# Eval("PhotoUrl") %>'
alternatetext='<%# Eval("LastName") %>'
runat="server"/>
</td>
<td>
<h3><%# Eval("FirstName") %> <%# Eval("LastName") %></h3>
<%# Eval("Title") %>
</td>
</tr>
</table>

</itemtemplate>

<pagersettings position="Bottom"
mode="NextPrevious"/>

</asp:formview>

<!-- This example uses Microsoft SQL Server and connects -->
<!-- to the Northwind sample database. Use an ASP.NET -->
<!-- expression to retrieve the connection string value -->
<!-- from the Web.config file. -->
<asp:sqldatasource id="StudentSource"
selectcommand="Select [StudentID], [LastName], [FirstName], [Title], [PhotoUrl] From [Employees]"
connectionstring="<%$ ConnectionStrings:NorthWindConnectionString%>"
runat="server"/>

</form>
</body>
</html>