Start learning with our library of video tutorials taught by experts. Get started
Viewers: in countries Watching now:
Thousands of businesses have used Microsoft ASP.NET to build professional, dynamic websites. In this course, web developer David Gassner demonstrates the tools needed to build and deploy a dynamic site using ASP.NET 3.5 or 4.5. Covering everything from installing and configuring Visual Web Developer 2008 or Visual Studio Express 2012 for Web and SQL Server Express to creating web form pages, this course is designed to give beginning and intermediate developers hands-on experience.
The ASP.NET Framework makes it easy to create a report that includes both the output data and the form controls that the user interacts with, to indicate which data they want to present. For this demonstration, I'll work with the file SelectData.aspx. In this version of the page, there is an SQLDataSource with a joint table query and a GridView that's presenting the data. When I run the page in the browser, I see that all of the data from the table is displayed. The first step in creating this sort of filtered report is to create a user interface that the user can interact with.
I am going to use an ASP.NET control called the DropdownList. In HTML terms, it's the Select control, but it will be dynamically populated with data from one of the database tables. I first need an SQLDataSource object that gets the data for that table. I'll place the cursor in the page right before the GridView. The easiest way to get there is to select the GridView, and then press the Left-Arrow key, then press Enter to create a new paragraph. If you move the cursor up to the previous line, you will see that the paragraph is there. Now type in a label, Publishers with a colon at the end. Select that text and press Ctrl+B to make it bold, then go to the database explorer, locate the publishers table and drag and drop it right after the Publishers: label.
That will result in creating the GridView control; for the moment you can't see the Publishers: label, but that's okay, just press the Delete key and you will see that the label is still there. So now we have an SQLDataSource object that's getting data from the publishers table, click on the SQLDataSource object and scroll up to the top of the Properties view and change the id to PubSataSource. This will let you easily distinguish between the SQLDataSource for the titles and the data source for the publishers. All right, the next step is to add the control that you want to show the publishers data. I'm going to click off the SQLDataSource object so I can see that my Publisher:'s label is still there in the background. I'll place the cursor right at the end of that string and press the spacebar to put an extra space in, then I'll go to the Toolbox panel and I'll locate the DropdownList control.
I will drag the DropdownList into the page and drop it right after the Publisher:'s label. It will look in Design view like the DropdownList is dropping down to the bottom, but when you actually run the page in the browser, you will see that the DropdownList control is displayed right next to that label. That's where you want it. Right now the DropdownList doesn't show any actual data, so I'll go back to Visual Web Developer and configure it. I'll make sure that the DropdownList is selected. Then I'll open the task list and select Choose Data Source. In the Data Source Configuration Wizard that appears, I'll open the list of available data sources and select PubDataSource.
For a DropdownList, you select two data fields: one that the user sees called the Display field and the other that provides the value for the DropdownList known as the Value field. In this table, there are two columns. The pub_name column is the one you want the user to see. So select that under the option Select the data field to display, and then check that the data field for the value is set to pub_id and click OK. And now your DropdownList is configured to display the data from the table. Test the page again and you should see that the Publisher list is now displayed when you open that DropdownList. Now we are going to connect the data source for the titles to this visual control.
I will close the browser and return to Visual Web develop. I'll go to the Data Source control that's being used to manage the titles. And then I'll go to the Properties view. I'll double-click its header and then resize it and locate the SelectQuery property. I'll click the button to open the SelectQuery and then click the Query Builder to rebuild the query visually. I will expand the Query Builder window so I can see more it. I'm going to filter the data on the pub_id column of the titles table. So I'll go to the titles table and select pub_id. Then I'll go down to the Grid Pane in the middle and I'll resize it so I can see that the pub_id column was added. The purpose of selecting the pub_id column was not to display it, so I'm going to uncheck the option under Output. But then I'll go the Filter and I'll put in the following filter, equals and then starting with an @ character pub_id. This defines a parameter in the query.
I will press the Tab key to save my changes and then take a look at the SQL in the SQL Pane. The newly generated query now has a WHERE class in the correct location that matches the parameter pub _id to the pub_id column of the titles table. I'll click OK to close the Query Builder. Now click Refresh Parameters and you will see that Visual Web Developer detects the new parameter, pub_id, and shows it in the Parameters list. Now we need to indicate where that parameter will be filled in from. Go to the right and pull down the list under Parameters source and choose Control, meaning we are going to get the data from a form control. Then pull down the list under controlID and choose DropdownList1. This is the DropdownList that's displaying the Publisher data. And then click OK. We are almost done.
The last step is to go back to that pull down list that showing the Publisher data and to cause it to post the page back to the server every time the user select a new value. After selecting the control, look in the Properties view, scroll up to the top and locate the property AutoPostBack and set it to a vale of true. That means that whenever the user changes the value, it will cause the page to repost and then in the .NET Framework on the server, the query will be rerun with the new filter and the GridView will show only the select records.
Save your changes and run the page in the browser. When the page first appears, it doesn't show any data. That's because there are no titles in the titles table that are matched to the Publisher ID for GGG&G. But now pull down the list of Publishers and try selecting Binnet & Hardley, and you will see that the page reposts and when it displays now it only shows the data for that publisher. Pull down the list again and choose another one, New Moon Books, and once again you will see the filtered data for just that publisher. Finally, check your preview, if you are using Internet Explorer, right-click anywhere on the page, and select Print Preview. If you are working in Firefox, go through the menu and it will display the currently selected publisher, and the selected titles.
So in this video I have shown you how to construct a filtered report adding an ASP.NET form control bound to a database table and then binding that control to the SQLDataSources Select command. The result is that the user can select the data they want to see and the .NET Framework handles all the filtering, all with doing very minimal programming.
Find answers to the most frequently asked questions about ASP.NET Essential Training.
Here are the FAQs that matched your search "":
Sorry, there are no matches for your search ""—to search again, type in another word or phrase and click search.
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.