When we build forms, we usually add some controls, like textboxes, checkboxes etc to our page and in our code-behind we set the value we want the controls to display, or bind the controls that support date binding to a data source. We also add buttons for update, delete and insert data into our data source. To perform actions when the button are pressed, we hook up to the buttons Click event and add the actions that should be performed, for eaxmple, collecting the data from the form's controls and save the data to our data source. Wouldn’t it be great if we could get all this for free? For example, we simply creates a form where we bind our controls to fields returned from a data source instead of setting the value programmatically, and when we press our Save button, the data will automatically be saved.
This could now be done with the FormView control. With the FormVirew control we could create a form where we associate it with a DataSource control and let the FromView control together with the DatraSource control handling the get, delete, insert and update data.
Here is a simple example where the FormView will display data from a data source and add the new data entered in the form to a data source by associating the FormView with a SqlDataSource control:
<%@ Page Language="C#" CompileWith="Default.aspx.cs" ClassName="Default_aspx" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Untitled Page</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:FormView ID="FormView1" Runat="server" DataSourceID="SqlDataSource1" DataKeyNames="EmployeeID">
<InsertItemTemplate>
LastName:
<asp:TextBox Text='<%# Bind("LastName") %>' Runat="server" ID="LastNameTextBox"></asp:TextBox><br />
FirstName:
<asp:TextBox Text='<%# Bind("FirstName") %>' Runat="server" ID="FirstNameTextBox"></asp:TextBox><br />
Title:
<asp:TextBox Text='<%# Bind("Title") %>' Runat="server" ID="TitleTextBox"></asp:TextBox><br /><br />
<asp:Button Runat="server" Text="Insert" CommandName="Insert" CausesValidation="False" ID="Button3" />
</InsertItemTemplate>
<ItemTemplate>
EmployeeID:
<asp:Label Text='<%# Eval("EmployeeID") %>' Runat="server" ID="EmployeeIDLabel"></asp:Label><br />
LastName:
<asp:Label Text='<%# Eval("LastName") %>' Runat="server" ID="LastNameLabel"></asp:Label><br />
FirstName:
<asp:Label Text='<%# Eval("FirstName") %>' Runat="server" ID="FirstNameLabel"></asp:Label><br />
Title:
<asp:Label Text='<%# Eval("Title") %>' Runat="server" ID="TitleLabel"></asp:Label><br /><br />
<asp:Button Runat="server" Text="New" CommandName="New" CausesValidation="False" ID="Button1" />
</ItemTemplate>
</asp:FormView>
<asp:SqlDataSource ID="SqlDataSource1" Runat="server"
InsertCommand="INSERT INTO [Employees] ([LastName], [FirstName], [Title]) VALUES (@LastName, @FirstName, @Title)"
SelectCommand="SELECT [EmployeeID], [LastName], [FirstName], [Title] FROM [Employees]"
ConnectionString="<%$ ConnectionStrings:AppConnectionString1 %>">
<InsertParameters>
<asp:Parameter Type="String" Name="LastName"></asp:Parameter>
<asp:Parameter Type="String" Name="FirstName"></asp:Parameter>
<asp:Parameter Type="String" Name="Title"></asp:Parameter>
</InsertParameters>
</asp:SqlDataSource>
</div>
</form>
</body>
</html>
If we run this page, we will see a form with labels that will display the data from the first row returned from the SelectCommand of the associated DataSource control. If we press the New button, the FormView will change mode and display the controls added to its InsertItemTemplate. The insert mode will now turn our labels into empty textboxes. If we enter some data and press the Insert button, the SqlDataSource InsertCommand will be executed and the data is inserted into our data source. We can also turn on paging for the FormView control. This could be useful if our DataSource’s SelectCommand returns several of rows. The FormView also support different kind of commands. To use those commands we can add button controls into our FormView control’s templates. To specify a command that the FormView should execute, we specify it by setting the button control’s CommandName attribute to the name of the command. The different commands that the FormView supports are listed below.
Paging:
Next
Prev
First
Last
The FormView has support for paging so we don’t really need to add button controls for those commands. We only need to use those if we want to create our own custom paging.
For changing modes:
New
Cancel
Edit
The New command will change the mode of the FormView to the Insert mode. The Cancel will turn back the mode to its default mode. The Edit will turn the mode into Edit mode.
For actions:
Insert
Delete
Update
When we press a button with the Insert command specified the FormView will execute the associated DataSource control’s InsertCommand. If the CommandName of the button is set to Delete or Update the DataSource’s DeleteCommand or UpdateCommand will be executed. By default the SelectCommand of the DataSource control will be executed.