Tài liệu Create a Point-and-Click Query Tool for Users Using a Web Form pptx

Tip Notice that the lstTables list box allows the user to choose only one table at a time, whereas lstColumns allows the user to choose multiple columns.. Listing 8.40 frmHowTo8_7.vb: Ex

8.7 Create a Point-and-Click Query Tool for Users Using a Web Form

As useful-if not more so-than the example shown in the 8.3 How-to, this exercise will show you how to add a data-driven query tool to your ASP.NET application

When creating database applications, even on the Web, one of your clients inevitably wants to be able to examine the data in his database, and not necessarily in edit pages The client wants to be able to list his data out and examine the data at his leisure

Giving the user the flexibility to do this via the Web is not as big of a hassle as it sounds This How-To will show you how to create a page to view the tables in your database, using a nice point-and-click interface

Technique

To accomplish the task just presented, you will be using the OleDbCommand and

DataReader objects Along with these objects, you will be using some stored procedures that SQL Server supplies Those stored procedures list the various objects within a SQL Server database-in this case, Northwind's tables and columns

You will take the elements returned in the DataReader object and load the Add method of the ListBox object

You will also use the Session object as you did in the previous How-To to save a

DataTable object for use over trips to the server

Finally, the ViewState object will be used to store a string variable when going to the server and back The ViewState object is a good NET state object to use for small pieces

of data, such as strings

Steps

Open and run the VB.NET -Chapter 8 solution From the main Web Form, click on the hyperlink with the caption How-To 8.7: Create a Point-and-Click SQL Server Query Tool for Users Using a Web Form When the new page opens, the first list box you see to the left is populated with the tables from Northwind Click on the Customer table, and you will see the columns listed in the list box labeled Columns Click on the

CompanyName and ContactName, and you will see the SQL String text box filled in After clicking on the View button, the Web page will look like the one displayed in Figure 8.14

1 Create a Web Form Then place the controls shown in Figure 8.14 with the properties set forth in Table 8.9

Table 8.9 Property Settings for Controls on the Point-and-Click Web Form Object Property Setting

Label Name Label1

Label Name Label2

Label Name Label3

Label Name Label4

Hyperlink Name hplBackToMain

2 Tip

Notice that the lstTables list box allows the user to choose only one table at a time, whereas lstColumns allows the user to choose multiple columns

A great enhancement to this tool would be to allow the user to choose multiple tables and have the application figure out the relationship between tables and create joins automatically

3 In the class module for the form, add the following Private declaration just below the line of code that reads Web Form Designer Generated Code:

4 Private mdtDisplay As DataTable

5 On the Web Form, add the code in Listing 8.40 to the Load event The first task is

to load the tables list box, performed by the subroutine LoadTables(), which is also in this listing The form only calls this routine if it is the first time into the page, by checking for Not Me.IsPostBack The form then tests to see whether the Session object has an entry called MyDisplayDataTable If the entry exists, then mdtDisplay is referenced to it, meaning that this time through the Load event is probably occurring on a trip back from the server The entry exists, and the code needs to set a reference to it

In LoadTables, the routine first creates a new OleDbConnection object called ocnn, an OleDbCommand object called ocmdTables It then assigns the built-in SQL Server stored procedure called sp_Tables when instantiating ocmdTables After establishing the CommandType as being CommandType.StoredProcedure and then opening the connection, the data reader called odrTables is created by calling the ExecuteReader method off ocmdTables

Listing 8.40 frmHowTo8_7.vb: Executing a SQL Server-Supplied Stored Procedure That Lists the Tables in the Database

Private Sub Page_Load(ByVal sender As System.Object,

ByVal e As System.EventArgs) Handles MyBase.Load

'Put user code to initialize the page here

If Not Me.IsPostBack Then

LoadTables()

End If

If Not (Session("MyDisplayDataTable") Is Nothing) Then

mdtDisplay = CType(Session("MyDisplayDataTable"), DataTable)

End If

End Sub

Sub LoadTables()

' Create the connection and specify the stored procedure to use

Dim ocnn As New OleDb.OleDbConnection(BuildCnnStr("(local)", _

"Northwind"))

Dim ocmdTables As New OleDb.OleDbCommand("sp_Tables", ocnn)

Dim odrTables As OleDb.OleDbDataReader

' Specify the type of command being performed

ocmdTables.CommandType = CommandType.StoredProcedure

ocnn.Open()

' Create the DataReader object

odrTables = ocmdTables.ExecuteReader()

' Loop through and add table type object names

' to the lstTables list box

Do While odrTables.Read

If odrTables.GetString(3) = "TABLE" Then

Me.lstTables.Items.Add(odrTables.GetString(2))

End If

Loop

End Sub

Next, the code loops through each of the items returned by the command Those of type TABLE are added to the lstTables items Then the connection is closed

As mentioned, you will see a comparison to the literal TABLE This is because the fourth column returned matches the current table type The other two types are SYSTEMTABLE and VIEW To see the data returned by the sp_tables stored procedure, open the Query Analyzer, as described in How-To 8.3

6 On lstTables, add the code in Listing 8.41 to the SelectedIndexChanged event This routine performs a similar feat as the previous routine; it will call a built-in stored procedure-in this case, sp_Columns However, the next task in this step is to pass a parameter, TableName, which is the table chosen in

lstTables.SelectedItem.Text After the connection is opened, the DataReader

called odrColumns is loaded with the ExecuteReader command After the

lstColumns.Items.Clear() method is called to clear the list, the new columns are added to the lstColumns Items collection Then the connection is closed

Listing 8.41 frmHowTo8_7.vb: Executing a SQL Server Built-In Stored

Procedure That Lists the Columns of a Supplied Table in the Database

Private Sub lstTables_SelectedIndexChanged(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles lstTables.SelectedIndexChanged

' Create the connection and specify the stored procedure to use

Dim ocnn As New OleDb.OleDbConnection(BuildCnnStr("(local)", _

"Northwind"))

Dim ocmdColumns As New OleDb.OleDbCommand("sp_Columns", ocnn) Dim odrColumns As OleDb.OleDbDataReader

' Specify the type of command being performed

ocmdColumns.CommandType = CommandType.StoredProcedure

ocmdColumns.Parameters.Add("@TableName",

Me.lstTables.SelectedItem.Text)

ocnn.Open()

' Create the DataReader object

odrColumns = ocmdColumns.ExecuteReader()

' Clear the current items in the list

Me.lstColumns.Items.Clear()

' Loop through and add table type object names

' to the lstTables list box

Do While odrColumns.Read

Me.lstColumns.Items.Add(odrColumns.GetString(3))

Loop

End Sub

7 On lstColumns, add the code in Listing 8.42 to the SelectedIndexChanged event After clearing the items from ddSortBy, this routine iterates through the Items collection of the lstColumns ListBox control, adding the chosen column names (those items with the Selected property set to True) to a string variable called strTemp The DropDown control called ddSoryBy adds the column name to its Items collection

After the string is finished iterating through the lstColumns Items, it is stored to a ViewState entry called SQLFields The LoadSQLString routine is then called, which is also in this listing

In the routine LoadSQLString, the length of the string is checked If the length is greater than 0, the Text property of txtSQLString is set to the following

expression: "Select " & strTemp & " From " & Me.lstTables.Text & " Order By "

& Me.ddSortBy.SelectedItem.ToString If the length is 0, then the Text property

of txtSQLString is set to the empty string

Listing 8.42 frmHowTo8_7.vb: Creating the SQL String

Private Sub lstColumns_SelectedIndexChanged(ByVal sender As

System.Object,

ByVal e As System.EventArgs) Handles

lstColumns.SelectedIndexChanged

Dim intNumColumns As Integer

Dim oCurr As Object

Dim blnIsSelected As Boolean

Dim strTemp As String

Me.ddSortBy.Items.Clear()

' Cycle through each of the selected columns of the table chosen

' and combine them into a string

For Each oCurr In Me.lstColumns.Items

If oCurr.Selected() = True Then

If Len(strTemp) > 0 Then

strTemp &= ", "

End If

strTemp &= oCurr.ToString

Me.ddSortBy.Items.Add(oCurr.ToString)

End If

Next

ViewState("SQLFields") = strTemp

LoadSQLString()

End Sub

Sub LoadSQLString()

' Take the string created and add it to the

' table name for a SQL String, if columns are chosen

If Len(ViewState("SQLFields")) = 0 Then

Me.txtSQLString.Text = ""

Else

Me.txtSQLString.Text = "Select " & ViewState("SQLFields") & _

" From " & Me.lstTables.SelectedItem.ToString & _

" Order By " & Me.ddSortBy.SelectedItem.ToString

End If

End Sub

8 On btnView, add the code in Listing 8.43 to the Click event This routine creates the new data adapter called odaDisplay, passes the Text property of txtSQLString, and then fills the dtDisplay DataTable The public variable, called mdtDisplay, references dtDisplay so that it will be seen in other routines The code then stores a new entry in the Session object called MyDisplayDataTable, which is loaded back into mdtDisplay upon reloading of the page Last, the routine BindTheGrid is called to set to the DataSource property of the data grid called dgDisplay

Listing 8.43 frmHowTo8_7.vb: Loading the DataGrid Control with the

Specified Data

Private Sub btnView_Click(ByVal sender As System.Object, _

ByVal e As System.EventArgs) Handles btnView.Click

Dim odaDisplay As OleDb.OleDbDataAdapter

Dim dtDisplay As New DataTable()

Try

' Take the txtSQLString text and create a data table Then set the

' data source of the data grid

odaDisplay = New OleDb.OleDbDataAdapter(Me.txtSQLString.Text, _ BuildCnnStr("(local)", "Northwind"))

odaDisplay.Fill(dtDisplay)

mdtDisplay = dtDisplay

Session("MyDisplayDataTable") = mdtDisplay

BindTheGrid()

Catch excData As Exception

End Try

End Sub

Sub BindTheGrid()

Me.dgDisplay.DataSource = mdtDisplay

' Must databind for ASP.NET

Me.dgDisplay.DataBind()

End Sub

9 On the ddSortby control, attach the first routine in Listing 8.44 to the

SelectedIndexChanged event Then add the second routine to the

PageIndexChanged event of dgDisplay

Figure 8.14 You can set the sorting of the data grid that is displayed here by

choosing from the drop-down list

Listing 8.44 frmHowTo8_7.vb: Loading the DataGrid Control with the Specified Data

Private Sub ddSortBy_SelectedIndexChanged(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles ddSortBy.SelectedIndexChanged LoadSQLString()

End Sub

Private Sub dgDisplay_PageIndexChanged(ByVal source As Object, _

ByVal e As System.Web.UI.WebControls.DataGridPageChangedEventArgs) Handles dgDisplay.PageIndexChanged

' Set the current page in the data grid

Me.dgDisplay.CurrentPageIndex = e.NewPageIndex

BindTheGrid()

End Sub

How It Works

When the form is opened, the lstTables ListBox control is loaded with the tables from the Northwind database When the user selects a table from the list, that table name is passed

to the stored procedure That procedure lists the columns in a database table that is

specified in the connection-in this case, Northwind These columns are loaded into

lstColumns

The user can click on multiple columns in lstColumns Those columns then are added to the SQL Select string that is created and stored in txtSQLString When the btnView button is clicked, the string is passed to a DataAdapter control, filling a data table From there, the data is displayed when the data source of the DataGrid control is set to the data table

Users can change the sort order by changing the value in the DropDown object

Comments

You can enhance this tool in several ways:

• Let users click on multiple tables and automatically create the join

• Add a list of columns for the user to choose to use for criteria, and allow the user

to input the criteria

• Use this tool as a base for editing or reporting the records that are returned

This technique's goal, as with others in this book, is to push you into thinking about the possibilities of what you can accomplish with Visual Studio NET and your databases