E-commerce App 4
The Goals for this Example
In e-commerce app 3 we displayed the results of a search in a data grid that
used paging as well as View buttons. Here, we make small adjustments and improvements. We try link
buttons instead of pushbuttons in the datagrid. We also use page numbers instead of previous and next
buttons for paging of the results. In addition, we find a way to avoid querying the database again each
time that the user goes to a new page of results. Finally, we add data validation to the search form so
that users cannot submit nonsense data (or worse yet, data that might help in hacking your application).
Copying the Previous Project
- Open the previous project, e-commerce app 3, in Visual Studio.
- Make a copy of this project and name the new project ecommerce4.
- Close the old solution and open the new ecommerce4 project.
- Save all of your files.
|
Adding Data Validation
- Since the search page allows the user to enter data into a text box to indicate what to search for,
we should add data validation to rule out nonsense and typical hacker symbols, etc. In fact,
the best thing to do is to only allow legitimate kinds of input in this box.
- We will add a required field validator to prohibit the user from submitting the empty string.
- Then we will use a regular expression validator to rule out all but acceptable characters
in the input box.
- If you have forgotton how to set up validators, see the following:
- See this screen shot of the web form with the validators
in place.
|
Required Field Validator
- Add a required field validator for the text box (to which we gave the ID of SubstringBox) on
the search.aspx web form.
- Place this validator right underneath the text box.
- For this validator use the error message: "You cannot leave the box empty."
|
Regular Expression Validator
- Add a regular expression validator for the text box and place it in a reasonable spot below
the box.
- Use "Only letters, digits, and spaces can be used -- up to 80 characters." as the error message.
- Use [a-zA-Z0-9 ]{1,80} as the validation expression. Notice that there is a blank character
after the 9. This regular expression only allows user input that consists of at least 1 and at
most 80 characters, where the allowed characters are alphabetic (lower or upper case), digits,
and the blank character. This would seem to be sufficient for users who want to search for
our products and leaves out the more unusual characters that hackers like to use.
|
The search.aspx.vb Code-Behind File
- This code really does not change.
- However, now that we have validators on our search.aspx form, the Page.IsValid is really
doing some important checking for us.
- Here is a copy of the code for the Page_Load procedure just to be sure that you have it right:
|
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
Dim Target As String
If IsPostBack Then 'Search button was clicked
Page.Validate()
If Page.IsValid Then
Target = SubstringBox.Text.ToString()
Session.Add("TargetSubstring", Target)
Response.Redirect("SearchResults.aspx")
End If
End If
End Sub
|
Adjusting the Search Results Page
- Save all of your files before going on.
- We now move to the SearchResults.aspx form.
- Here we make some small changes in order to see other ways of doing things.
|
Changes to the DataGrid
- The changes that we wish to do can be seen in this picture.
- To switch from push buttons to link buttons, click on the DataGrid. Then click on
the Property Builder link. Click on the Columns tab and then on Button Column.
Change the Button type to LinkButton.
- To change from the use of Previous and Next buttons for paging to page numbers,
click on the Paging tab in Property Builder. Change the Mode to "Page numbers".
- The Visual Studio help system tells you that the page number option will then be available and
allow you "to specify how many page numbers are displayed at a time on the grid.
If the data source contains more pages than the number of page numbers you display, the grid
includes an ellipsis (...) to allow users to move to the next set of page numbers."
You might use 3 for this option.
|
A More Efficient Code-Behind File
- At present, each time a user switches to a different page of search results, the code
queries the database again. This tends to be slow and inefficient.
- Let's just query the database once (in Page_Load) and save the DataTable of results
in the session state
so that it can be easily retrieved anytime the user chages to a new page of results in the DataGrid.
- To do this, we insert the following line of code right after the use of DataBind in the Page_Load
procedure:
|
Session.Add("DataTable", dTable)
|
- This means that the Page_Load procedure looks like this:
|
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
Dim Substring As String
If Not IsPostBack Then
If Session.Count = 0 Then ' No session items were supplied.
SessionErrorLabel.Visible = True
Else
Try
Substring = Session("TargetSubstring")
If Substring = "" Then
SessionErrorLabel.Visible = True
Else
SqlConnection1.Open()
SqlDataAdapter1.SelectCommand.Parameters("@Target").Value = Substring
SqlDataAdapter1.Fill(dTable)
If dTable.Rows.Count = 0 Then
NoDataLabel.Visible = True
DataGrid1.Visible = False
Else
DataView1 = New DataView(dTable)
DataGrid1.DataBind()
Session.Add("DataTable", dTable)
DataGrid1.Visible = True
End If
End If
Catch exception As System.Data.SqlClient.SqlException
DatabaseErrorLabel.Visible = True
Catch exception As Exception
ErrorLabel.Visible = True
Finally
SqlConnection1.Close()
End Try
End If
End If
End Sub
|
- We then change the DataGrid1_PageIndexChanged procedure so that it
looks up its data in the session state instead of again querying the database.
- Change this procedure to match the following:
|
' handles DataGrid1 page changed event
Private Sub DataGrid1_PageIndexChanged(ByVal sender As Object, _
ByVal e As DataGridPageChangedEventArgs) _
Handles DataGrid1.PageIndexChanged
Dim Substring As String
If Session.Count = 0 Then ' No session items were supplied.
SessionErrorLabel.Visible = True
Else
dTable = Session("DataTable")
If dTable.Rows.Count = 0 Then
NoDataLabel.Visible = True
Else
DataView1 = New DataView(dTable)
DataGrid1.CurrentPageIndex = e.NewPageIndex 'Show new page
DataGrid1.DataBind()
DataGrid1.Visible = True
End If
End If
End Sub
|
- We leave the DataGrid1_ItemCommand procedure unchanged.
- If the DataTable of search results is large, saving it in the session state might
well introduce its own inefficiencies.
|
Testing Your Web Application
- Save all files and build your project.
- Test your new web app in a browser. In particular, check the search functionality
and be sure that the paging works correctly for the search results.
- Also test that the validators work correctly on the search page.
- If the user leaves the text box empty, the required field validator
should display its error message as shown in this
screen shot.
- If the user enters unacceptable characters (not allowed by our regular expression
[a-zA-Z0-9 ]{1,80} as used above),
then we should see the complaint from the regular
expression validator. The same error message should appear if you try to enter
more than 80 characters into the text box.
|
|