Server Intellect
 
Home   Asp.Net Tutorials   What's New   Newsletter   More Resources
Tutorial RSS
 
  Categories
Advanced Technologies
AJAX
Internet Browsers
Controls
Database
Email
Error Handling
File
Graphics
Website Navigation
Network
Performance
User Interface and Themes
Validation
Visual Web Developer
Web Services
XML
Suggest Tutorial


Navigator: Home - Tutorials - Database - Using FormView control to edit/delete in ASP.NET & C#
Using FormView control to edit/delete in ASP.NET & C#


ASP.NET Database Tutorial

This tutorial shows how we can use the FormView control to display data from a SQL database, and also allow adding, updating and deletion of this data.

This tutorial uses an example SQL database to show how the FormView control can display data for a user to edit, delete and also add to the database.
Web.Config:

<connectionStrings>
<add name="BasicDataAccessConnectionString" connectionString="Data Source=CLIENT-TASK2\SQLEXPRESS;Initial Catalog=BasicDataAccess;Integrated Security=True" providerName="System.Data.SqlClient" />
</connectionStrings>

Need help with Windows Dedicated Hosting? Try Server Intellect. I'm a happy customer!

We add a DropDownList control to enable selection of records, and a FormView control to allow display and editing of the selected record. Each of these controls will have their own SqlDataSource:

<form id="form1" runat="server">
<div>
<asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="True" DataSourceID="SqlDataSource1" DataTextField="theName" DataValueField="theID" AppendDataBoundItems="True" OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged">
<asp:ListItem>(Select)</asp:ListItem>
</asp:DropDownList>
<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%# ConnectionStrings:BasicDataAccessConnectionString %>" SelectCommand="SELECT [theID], [theName], [theCity] FROM [tblOne]"></asp:SqlDataSource>
<asp:FormView ID="FormView1" runat="server" DataKeyNames="theID" DataSourceID="SqlDataSource2" Height="206px" Width="347px" OnItemDeleted="FormView1_ItemDeleted" OnItemInserted="FormView1_ItemInserted" OnItemUpdated="FormView1_ItemUpdated">
<EditItemTemplate>
<table style="width: 100%; height: 100%">
<tr>
<td align="right" style="width: 100px">ID:</td>
<td align="left" style="width: 100px">
<asp:Label ID="theIDLabel1" runat="server" Text=&##60;%# Eval("theID") %>'></asp:Label></td>
</tr>
<tr>
<td align="right" style="width: 100px">Name:</td>
<td align="left" style="width: 100px">
<asp:TextBox ID="theNameTextBox" runat="server" Text='<%# Bind("theName") %>'>
</asp:TextBox></td>
</tr>
<tr>
<td align="right" style="width: 100px">City:</td>
<td align="left" style="width: 100px">
<asp:TextBox ID="theCityTextBox" runat="server" Text='<%# Bind("theCity") %>'>
</asp:TextBox></td>
</tr>
<tr>
<td align="center" colspan="2">
<asp:LinkButton ID="UpdateButton" runat="server" CausesValidation="True" CommandName="Update" Text="Update"></asp:LinkButton> - <asp:LinkButton ID="UpdateCancelButton" runat="server" CausesValidation="False" CommandName="Cancel" Text="Cancel"></asp:LinkButton>
</td>
</tr>
</table>
<br />
&nbsp;
</EditItemTemplate>
<InsertItemTemplate>
<table style="width: 100%; height: 100%">
<tr>
<td align="right" style="width: 100px">ID:</td>
<td align="left" style="width: 100px">
<asp:TextBox ID="theIDTextBox" runat="server" Text='<%# Bind("theID") %>'></asp:TextBox>
</td>
</tr> <tr>
<td align="right" style="width: 100px">Name:</td>
<td align="left" style="width: 100px">
<asp:TextBox ID="theNameTextBox" runat="server" Text='<%# Bind("theName") %>'></asp:TextBox>
</td>
</tr>
<tr>
<td align="right" style="width: 100px">City:</td>
<td align="left" style="width: 100px">
<asp:TextBox ID="theCityTextBox" runat="server" Text='<%# Bind("theCity") %>'></asp:TextBox>
</td>
</tr>
<tr>
<td align="center" colspan="2">
<asp:LinkButton ID="InsertButton" runat="server" CausesValidation="True" CommandName="Insert" Text="Insert"></asp:LinkButton> -
<asp:LinkButton ID="InsertCancelButton" runat="server" CausesValidation="False" CommandName="Cancel" Text="Cancel"></asp:LinkButton>
</td>
</tr>
</table>
<br />&nbsp;
</InsertItemTemplate>
<ItemTemplate>Sample Database<br />
&nbsp;&nbsp;
<table style="width: 150px; height: 150px">
<tr>
<td align="right" style="width: 100px">ID:</td>
<td align="left" style="width: 100px">
<asp:Label ID="theIDLabel" runat="server" Text='<%# Eval("theID") %>'>
</td>
</tr>
<tr>
<td align="right" style="width: 100px">Name:</td>
<td align="left" style="width: 100px">
<asp:Label ID="theNameLabel" runat="server" Text='<%# Bind("theName") %>'></asp:Label>
</td>
</tr>
<tr>
<td align="right" style="width: 100px">City:</td>
<td align="left" style="width: 100px">
<asp:Label ID="theCityLabel" runat="server" Text='<%# Bind("theCity") %>'></asp:Label>
</td>
</tr>
<tr>
<td align="center" colspan="2">
<asp:LinkButton ID="NewButton" runat="server" CausesValidation="False" CommandName="New" Text="New"></asp:LinkButton> -
<asp:LinkButton ID="EditButton" runat="server" CausesValidation="False" CommandName="Edit" Text="Edit"></asp:LinkButton> -
<asp:LinkButton ID="DeleteButton" runat="server" CausesValidation="False" CommandName="Delete" Text="Delete"></asp:LinkButton>
</td>
</tr>
</table>
</ItemTemplate>
</asp:FormView>
<asp:SqlDataSource ID="SqlDataSource2" runat="server" ConnectionString="<%# ConnectionStrings:BasicDataAccessConnectionString %>" DeleteCommand="DELETE FROM [tblOne] WHERE [theID] = @theID" InsertCommand="INSERT INTO [tblOne] ([theID], [theName], [theCity]) VALUES (@theID, @theName, @theCity)" SelectCommand="SELECT * FROM [tblOne] WHERE ([theID] = @theID)" UpdateCommand="UPDATE [tblOne] SET [theName] = @theName, [theCity] = @theCity WHERE [theID] = @theID">
<DeleteParameters>
<asp:Parameter Name="theID" Type="Int32" />
</DeleteParameters>
<UpdateParameters>
<asp:Parameter Name="theName" Type="String" />
<asp:Parameter Name="theCity" Type="String" />
<asp:Parameter Name="theID" Type="Int32" />
</UpdateParameters>
<SelectParameters>
<asp:ControlParameter ControlID="DropDownList1" Name="theID" PropertyName="SelectedValue" Type="Int32" />
</SelectParameters>
<InsertParameters>
<asp:Parameter Name="theID" Type="Int32" />
<asp:Parameter Name="theName" Type="String" />
<asp:Parameter Name="theCity" Type="String" />
</InsertParameters>
</asp:SqlDataSource>
</div>
</form>

Try Server Intellect for Windows Server Hosting. Quality and Quantity!

When the user updates, deletes or adds a new record using the FormView control, we need to tell the ListBox to update it's list from the database.
The following code will also make the FormView appear once the user has selected an item from the drop-down list, and the initial item of (Select) in the list will disappear once the user has selected from the list.

protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
FormView1.Visible = false;
}
}
protected void FormView1_ItemInserted(object sender, FormViewInsertedEventArgs e)
{
DropDownList1.Items.Clear();
DropDownList1.DataBind();
}
protected void FormView1_ItemUpdated(object sender, FormViewUpdatedEventArgs e)
{
DropDownList1.Items.Clear();
DropDownList1.DataBind();
}
protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)
{
if(DropDownList1.Items[0].Text == "(Select)")
{
DropDownList1.Items.RemoveAt(0);
}
FormView1.Visible = true;
}
protected void FormView1_ItemDeleted(object sender, FormViewDeletedEventArgs e)
{
DropDownList1.Items.Clear();
DropDownList1.DataBind();
}

Download the Full Working Version of this Project written with Visual Studio.NET C# 2005 Here!

Looking for the VB.NET 2005 Version? Click Here!

Looking for more ASP.NET Tutorials? Click Here!





 
  Developer Resources







Server Intellect Rocks