Home Page

UPDATE: 2010 Developer Action Plan The folks at LearnVisualStudio.NET have created a new Developer Action Plan packed with strategies and advice to help you get that elusive first .NET development job and also become an awesome ASP.NET developer. This action plan is perfect:

  • For those with little or no .NET experience, or...
  • For those with programming experience, but who feel like their skills are deteriorating or becoming stale

If you simply enter your email in the next 15 minutes, you will get:

  • A download link for the 2010 Developer Action Plan
  • 4 hours of free ASP.NET training videos you can watch from the comfort of your computer


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.

10 Comments »

  1. Hi, thanks for the help in this regard. I am new to this world Microsoft Development. I am still one of the old assembler mainframe CICS, IMS, CICS guys that spent the last 20 years managing large installations and I am now developing applications for people that have not learnt the basics about managing people (Performance Management, Career Planning, Succession Planning and so on) . I really battled to get my head around the basics, but I am there, my first application to be out soon.
    Again, thank you!

    Comment by — April 20, 2009 @ 11:31 pm

  2. I did the tutorial in ASP.NET 2.0 /w Oracle 10g, and the only difference is that in the query, instead of ‘@’ you should put ‘:’

    I put this here, so other people could figure it out.

    BTW thanks for the tutorial, it helped me do my homework :)

    Comment by — May 2, 2009 @ 1:07 pm

  3. I just spent hours trying to find something as helpful as the write-up here and yet I still needed to go a step further so I’m posting this comment in case others are looking for a way to run a parameterized insert query using visual studio and a textbox control. Add a sqldatasource control to your web form and in the properties pane click on the elipse next to the (Query) reference in the InsertQuery property. In the “Command and Parameter Editor” that pops up, select “Control” from the drop down list under the “Parameter Source:” heading, then you can select which control you want to use from the drop down list under the “ControlID:” heading…

    Thanks again for this write up!

    Comment by Eoin Callan — August 4, 2009 @ 3:43 pm

  4. i want to insert userid,username,usertext from table user,name,data
    in table data
    so how it is possible

    Comment by narayan — August 13, 2009 @ 1:34 am

  5. Thanks a lot. Its very helpful.

    Comment by — September 11, 2009 @ 4:46 am

  6. If you are getting this error “Must declare the scalar variable @last_name” or something similar it is because you are trying to use a variable in your SqlDataSource SQL statement without having a parameter created for it. You have to remember to create parameters in your SqlDataSource control. In this example, take a look at the source code to see how I created InsertParameters for each of the variables in my Insert SQL statement.

    Comment by ted — September 19, 2009 @ 2:09 pm

  7. There is no sound on the Video about using textbox data and store it into a SQL DB. I would like to view it.

    Comment by Hannes — January 18, 2010 @ 3:54 pm

  8. i have looked for so long for this and finally i can smile.

    Comment by Alicia — March 27, 2010 @ 8:27 pm

  9. Thanks for your excellent example.
    One may add the following code to the routine FormView1_Inserted to handle the errors:
    if (e.Exception == null)
    {
    Response.Redirect(”home.aspx”);
    }else{
    Response.Write(e.Exception.Message);
    e.ExceptionHandled = true;
    }

    Comment by — June 6, 2010 @ 4:42 pm

  10. Ted,

    thank you so much for publishing this. I spent 2 days scouring the web for a basic tutorial on how to make a basic web page that posts back the informatin to a database.

    Your webpage and download saved me.

    Thanks again,
    Chris

    Comment by — June 20, 2010 @ 10:55 pm

RSS feed for comments on this post.

Leave a comment