Author: Ted Kolovos
Website: Amazing ASP.NET -

Click here to download the source code for this lesson.  When you open the project files, set CreateCustomerRecord.aspx as the Start Page.

In this lesson, I am going to show you how to Insert data into a database table with values from TextBox controls using the FormView and SqlDataSource controls.

Typically in web applications, you encounter scenarios where you need to gather information from the user and create a record in a database table based on the what was entered.  A common example of this is a registration form that a lot of websites have you fill out in order to become a member of their site.  You may enter your personal information such as your last name, first name, etc. and the registration application will capture that information in a database table in order to create an account for you.  In this example I am going to capture three pieces of personal information about the user as a demonstration: first name, last name and e-mail address.  I am going to Insert that information into a database table named “customer”.

I created a new web form named CreateCustomerRecord.aspx.  This form contains 3 TextBox controls at the top to capture the user’s information mentioned above.  At the bottom of the form I placed a Save Button which will execute the database Insert statement and create the record in the database.  Once the Insert operation completes, the application will automatically redirect to a home page.

Now the fun part.  Here is a technical step by step explanation of what I did to make it all work using the ASP.NET FormView and SqlDataSource controls.

First I placed a FormView control on the web form and then put an InsertItemTemplate inside it.  I set the DefaultMode property of the FormView to “Insert”.

Next I put the three TextBox controls and the Save button inside the InsertItemTemplate.  The TextBox controls need to have data bindings so I put the Bind() expression in the Text property of each TextBox control.  Here is what the first name TextBox looks like with the data binding:

<asp:TextBox ID="txtFirstName" runat="server"
  MaxLength="50"
  Text='<%# Bind("first_name") %>'>
</asp:TextBox>

You can see that the txtFirstName TextBox is bound to a data field named “first_name”.  The other two text boxes are bound similarly to their corresponding data fields.

I’m almost done setting up the FormView, but there are a couple of things left to configure.  Next I set the CommandName property of the Save button to “Insert”.

<asp:Button ID="btnCreateRecord" runat="server" Text="Save"
CommandName="Insert" />

I also created a FormView event named “FormView1_Inserted” that will execute after the FormView has completed Inserting the new database record.  Inside that even handler I put one line of C# code to redirect the application to “home.aspx” (a sample home page).

That takes care of the FormView, now it’s time to setup the SqlDataSource control that is responsible for actually performing the database table Insert operation.

I placed an SqlDataSource control on the form and set some of the properties.  The first property that I set is the InsertQuery property.  This property specifies what SQL statement you want the ASP.NET engine to execute when an Insert operation occurs.  In the SqlDataSource InsertQuery property, when you click on the … ellipses button, a popup window will appear.  I placed the following SQL Insert statement into the popup window:

INSERT into customer (first_name, last_name, email_address) values (@first_name, @last_name, @email_address)

Notice that I placed an @ symbol in front of the field names in the values clause.  The @ means that those are named parameter variables.  In other words, they are going to be dynamically filled in at runtime and I don’t have to hard code them.  When finished, I clicked OK to close the popup window.

Next I set the ConnectionString property of the SqlDataSource control.  This is important so that the control knows what database to connect to in order to execute any SQL statements.  That pretty much does it for the SqlDataSource control configuration.

Now there is one more thing left to do in order to link the FormView control with the SqlDataSource control so that when the user clicks on the Save button, the SqlDataSource will take over.  I set the DataSourceID property of the FormView to the control ID of the SqlDataSource control.  My SqlDataSource has a control ID of “InsertDataSource”.  So I set the FormView property as DataSourceID=”InsertDataSource”.  This associates the two controls with one another so that they can communicate with each other.

That is pretty much it.  Not too bad huh?.  Download the source code and experiment with the project yourself.

Click here to watch an example video where I walk through the entire process of setting up the FormView and the SqlDataSource to use the values from TextBox controls and perform the database Insert.