You can display a more comforting message to the user on this page. Additionally, you can validate the data before sending it to the database by handling the Updating

event in the LINQ data source object. The event handler for this method takes a LinqDataSourceUpdateEventArgs parameter that contains the original values and the new

values for the row. Your code can scrutinize the new values, and if they are invalid, your code can set the Cancel property of the LinqDataSourceUpdateEventArgs parameter to false to

indicate that the data source should not attempt to update the database.

Also, notice that the database is updated as soon as the user clicks the Update button. This is the default functionality implemented by a GridView control that is bound to a LINQ data

source and is probably the most suitable mechanism for building interactive Web forms. If you want to modify the update behavior (for example, so that the GridView control will store

multiple updates locally and then submit them as a single batch), you can implement your own custom mechanism. However, the details for doing this are outside the scope of this book.

Navigating Between Forms

A key aspect of many Web Forms applications is the ability to navigate from one form to

another by clicking a hyperlink or button. In addition, you often need to pass information between forms. In the CustomerData Web form, it would be useful to be able to click a cus-

tomer and display another form showing the order history for that customer. This is what you will do in the exercises in this section.

In this section, you will create a new Web form for displaying order history information. You will use a GridView control to display the data, but you will populate the data by executing a

SQL Server stored procedure rather than querying a table. The Northwind database contains a stored procedure called CustOrderHist. This stored procedure takes a customer ID as a pa-

rameter and returns a result set containing the name and quantity of each product the cus-

tomer has ordered. When the user selects a customer in the CustomerData Web form, you must pass the value in the CustomerID column to this new form.

The first step, therefore, is to modify the CustomerData Web form to enable the user to select a customer.

Modify the CustomerData Web form

1.Return to the Code and Text Editor window displaying the HTML source code for the CustomerData Web form.

2.Change the definition of the boundfield element displaying the customer ID to a HyperLinkField, as shown here in bold type:

<asp:HyperLinkField DataField=”CustomerID” ...></asp:HyperLinkField>

The data in this column in the GridView control will be displayed as a hyperlink rather than as a label. The user can click this hyperlink. The following steps set properties that specify the actions that occur when this happens.

3.Change the DataField property of the control to a DataTextField property, as shown in bold type here:

<asp:HyperLinkField DataTextField=”CustomerID” ...></asp:HyperLinkField>

The HyperLinkField control does not have a DataField property. The DataTextField specifies the property from the data source to which the hyperlink binds.

4.Remove the ReadOnly property of the control, and add the Target,

DataNavigateUrlFields, and DataNavigateUrlFormatString properties shown in bold type here:

<asp:HyperLinkField DataTextField=”CustomerID” HeaderText=”Customer ID”

Target=”_self” DataNavigateUrlFields=”CustomerID” DataNavigateUrlFormatString=”~\OrderHistory.aspx?CustomerID={0}”

SortExpression=”CustomerID”>

</asp:HyperLinkField>

The DataNavigateUrlFormatString property specifies the address to which the Web application should move when the user clicks the hyperlink. In this example, the application navigates to the OrderHistory.aspx form (which you will create in the next exercise)

and includes a query string parameter containing a customer ID. This query string currently contains a placeholder. The DataNavigateUrlFields property determines the value that should be used for this placeholder—the data in the CustomerID field for the current row in the GridView control. The Target property specifies where the OrderHistory.

aspx Web form should be displayed. The value _self causes ASP.NET to reuse the same Internet Explorer window that is currently displaying the CustomerData form.

Note ASP.NET also provides the HyperLink control in the Standard category in the Toolbox. When using this control, you can specify a URL to move to in its NavigateUrl property. In addition, you can execute the Transfer method of the Server property of a

Web form if you want to transfer control from one Web form to another programmatically.

4.In the Properties window, set the Title property of the DOCUMENT object to Northwind Traders – Orders for:.

5.From the Standard category in the Toolbox, add a Label control and a HyperLink control to the Web form.

6.Using the Properties window, set the properties for the Label and HyperLink controls to the values shown in the following table.

7.In the Data category of the Toolbox, click the GridView control and drag it onto the form. A GridView is added to the form and displays placeholder data.

8.Using the Properties window, set the (ID) property for the GridView control to

OrderGrid.

9.In the Design View window, click the OrderGrid control, and then click the smart tag to display the Common GridView Tasks menu.

10.On the Common GridView Tasks menu, click the Auto Format link.

11.In the AutoFormat dialog box, select the Classic scheme, and then click OK.

In this form, you are going to write code to bind the GridView control to the data source. You will define the columns in the GridView control manually.

12.On the Common GridView Tasks menu, click the Edit Columns link.

13.In the Fields dialog box, in the Available Fields list box, click BoundField, and then click

Add.

14.In the BoundField properties list box, set the HeaderText property to Product Name.

15.In the Available Fields list box, click BoundField, and then click Add again.

16.In the BoundField properties list box, set the HeaderText property of the new column to Total, and set the DataFormatString property to {0:N0}. (Both the 0 characters are zeros—this format displays the data as a number with no decimal places.) Expand the

618 Part VI Building Web Applications

ItemStyle property, and then set the HorizontalAlign property to Right (by convention, numeric data is displayed right-justified).

17.Clear the Auto-generate fields check box, and then click OK.

18.Click the Source button, and modify the body element to lay out the controls on the form underneath one another, with some blank lines between them, as shown in bold type here:

<body>

<form id=”form1” runat=”server”> <div>

<asp:Label ID=”OrderLabel” ...></asp:Label>

<br /> <br />

<asp:HyperLink ID=”HyperLink1” ...></asp:HyperLink>

<br /> <br />

<asp:GridView ID=”OrderGrid” ... >

...

</asp:GridView>

</div>

</form>

</body>

The final task is to write some code that displays the customer ID on the form, bind the GridView control and its columns to the OrderHistory data source, and then display the data.

Write code to bind the GridView control to the data source

1.In Solution Explorer, expand OrderHistory.aspx, and then double-click OrderHistory. aspx.cs to display the C# code for the OrderHistory form in the Code and Text Editor window.

2.In the Page_Load method, add the statement shown here in bold type:

protected void Page_Load(object sender, EventArgs e)

{

string customerId = Request.QueryString[“CustomerID”];

}

Remember that the OrderHistory form is invoked from the CustomerData form when the user clicks the hyperlink control for one of the customers displayed in the GridView

control on that form. The hyperlink control specifies a URL with a query string that

contains the selected customer ID. For example, if the user clicks the customer with the ID “ALFKI,” the hyperlink opens the OrderHistory form with the query string value pair “CustomerID=ALFKI”. The Request object of a Web form is a collection of the query

string value pairs passed in to the form. You can access the values either by number or

by name. The code you have just written retrieves the value of the pair with the name CustomerID from the Request object and stores it in a local string variable.

3. Add the code shown here in bold type to the Page_Load method:

protected void Page_Load(object sender, EventArgs e)

{

string customerId = Request.QueryString[“CustomerID”]; this.OrderLabel.Text += “ “ + customerId;

this.Title += “ “ + customerId;

}

These statements append the customer ID to the text displayed on the form and in the title of the form.

4. Add the following statements to the Page_Load method:

protected void Page_Load(object sender, EventArgs e)

{

...

OrderHistoryDataContext context = new OrderHistoryDataContext(); var orderDetails = context.CustOrderHist(customerId); this.OrderGrid.DataSource = orderDetails;

}

This code creates a new DataContext object using the OrderHistoryDataContext class. The OrderHistoryDataContext class was generated by the Object Relational Designer when you created a new data source based on the CustOrderHist stored procedure. When you add a stored procedure to a DataContext type, the code generated by the Object Relational Designer exposes the stored procedure by providing a method

with the same name. The second statement in the preceding code example calls the CustOrderHist method, which in turn invokes the CustOrderHist stored procedure in the Northwind database. The customerId variable is passed in as the parameter. The result set generated by this stored procedure is used as the data source for the OrderGrid

control.

5. Append the code shown here to the end of the Page_Load method:

protected void Page_Load(object sender, EventArgs e)

{

...

BoundField productName = this.OrderGrid.Columns[0] as BoundField; productName.DataField = “ProductName”;

BoundField total = this.OrderGrid.Columns[1] as BoundField; total.DataField = “Total”;

this.OrderGrid.DataBind();

}

This block of code binds the two columns in the OrderGrid control to the correspond-

ing properties in the data source. Notice that you specify the properties by name, as a string. The DataBind method of the OrderGrid control causes the data source to run the

stored procedure and generate the result set, displaying the results in the columns in the grid.

Test the completed application

1.Run the application, and log in as John.

2.On the CustomersData Web form, notice that the values in the Customer ID column are now displayed as hyperlinks:

3.Click the hyperlink for the first customer, ALFKI. The OrderHistory form should appear, displaying the order history for ALFKI.