Easy-to-follow video tutorials help you learn software, creative, and business skills.Become a member
After creating a page and adding a DetailsView control to it that's bound to an SQL data source, and after applying whatever formatting is needed, you can then use the page to create the Insert form that automatically receives data from the user and passes that data back to the server-side database using an SQL statement. For this demonstration, I'll use the file AuthorInsert.aspx. Open the file now and look at the page in Design view. You will see that it already has a DetailsView control and when you run the page in the browser, which I'll do by selecting Debug > Start Without Debugging, you will see that it's displaying the first row of the dataset.
I will close the browser and then make some changes to the page to turn this into an insert form that the user can type values into. First, I'll modify the header. I'll select the header control in Design view, then go to Source view. By first selecting the item in Design, and then going to Source, it results in selecting the matching code when you get to Source view. Then I'll go to full screen, so that I can see as much code as possible and close the Output panel if necessary. And I'll change the heading attribute of the Header control from Author Detail to Insert Author. Then I'll go back to Design view.
Now I'll go to the control and I'm going to turn on insert capability. I'll click on the control, then click the Smart Tasks icon to open the task list and I'll select Enable Inserting. When you select the Enable Inserting option, you will see a new link appears at the bottom of the form labeled New. Save your change, pressing Control+S and then run the page in the browser. When you simply turn the insert functionality on, the control automatically adds the New link at the bottom. When you click the link, you will see that the page is represented this time only presenting the non-primary key columns.
Notice that the author ID is not present now, because that's the value that will be populated by the database when a new record is inserted. The user can now type values in. I will type in the last name of Aardvark, our first name of Alfred and then some dummy data for the rest. Make sure that you follow the basic rules of the database that is if you don't type in values that are too long for the back-end database columns, and that you do type in a value for each column. So I'll type in an address of 123 Main St., a city of Smallville, a state of KS, make sure you only type in two characters here and then a numeric zip code of five numbers. Then I'll click the Insert link, watch what happens.
I will come back to the display of the data, but because I haven't done anything to tell the Forms view which record to display, it's displaying still the first item in the database. But to ensure that that actually worked, I'll close the browser, I'll go out of full screen by clicking the Full Screen button up at the top, I'll go to the Database Explorer, to the Authors table, right-click on Authors and select Show Table Data and then I'll scroll down to the bottom of the table and show you that the data was successfully inserted into the database table.
So how did all that happen? How was the DetailsView control passing the data to the data source on the back-end? Well let's take a look at the Source view. I'll go into Source view and then select View > Full Screen and close the Output view. When I connected the DetailsView to the SQL data source, which I did through the data source ID, that told the DetailsView that when it was in Insert mode it should use elements of that data source to actually modify the data in the server. In the SQL data source control, which is down toward the bottom of the code, right down here, there is already an Insert command that was created by Visual Web Developer when I dragged the table into the page. You will see that it has an Insert statement that's well formed and in the Insert statement, there is a list of the columns that need to be inserted, the table name and also parameters which are represented by the @ character at the beginning of the string.
Then a little further down, a set of insert parameters that define the names and data types of the values that need to be passed in. The DetailsView already knows how to match all these codes together, how to use the Insert statement that's modeled in the Insert Command attribute and how to pass the values into the parameters from the DetailsView controls. But you will notice right now if you run the page again, that the page is designed to stand on its own, rather than being navigated to from a list control. So I'm going to make one change in the page to conclude this demonstration. I'll go back to Design view and select the control. I'll leave Full Screen view so I can see all of my panels, I'll go to the Properties view and double-click it to make it float and then I'll move and resize it, so I can see more of the properties information.
Then I'll locate a property called DefaultMode. The DetailsView control's DefaultMode can be set to one of these values: ReadOnly, which it set to automatically when you drag it into the page, Edit and Insert. If you want this to be a dedicated insert form page, just set the DefaultMode from ReadOnly to Insert and you'll immediately see in Design view in the background that the DetailsView control now presents the form with the text input controls. Now let's test the page again. I'll press Ctrl+S to save and run the page without debugging. Once again, I'll type in some values. I'll type in the last name once again of Aardvark, this time with another value, so I can see the difference between the first and then I'll type in some other values. This time when I click the Insert link, instead of going back to the ReadOnly presentation where I'm seeing the first record in the data set, I come back now to the actual data entry form and I can start adding another record.
Then I'll once again, ensure that the data is actually getting to the database table, I'll go to the Database Explorer, locate the table authors, right-click and select Show Table Data, scroll down to the bottom, and show that the record was in fact, added. So that's how you create a stand-alone Insert Form page. You add the Details form, you enable the insert architecture and then you set the default mode to Insert. Now in another video, I'll show how to take this page and a list page and bind them together, so that your data entry workflow is in uninterrupted cycle going from list control to insert page and back again.
Get unlimited access to all courses for just $25/month.Become a member
61 Video lessons · 92663 Viewers
82 Video lessons · 104179 Viewers
71 Video lessons · 75773 Viewers
56 Video lessons · 107143 Viewers
Access exercise files from a button right under the course name.
Search within course videos and transcripts, and jump right to the results.
Remove icons showing you already watched videos if you want to start over.
Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.
Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.
Your file was successfully uploaded.