Chapter 3: Develop A Multi-Page Web Application

1. Chapter 3: Develop A Multi-Page Web Application Liu, Jie Professor Department of Computer Science Western Oregon University

2. The Store Application • A Halloween Store – online retail • One page for viewing the products • Accessing a database • Switch to a different page • One page to view the shopping cart • Share information from the previous page • The Code

3. Some Skills • Add a class (OOP) • Add an existing class • Right click on Solution Explorer  Add Existing Item • Add a New class • Right click on Solution Explorer  Add Existing Item • Refer a class in the class library • Add another page • Right click on Solution Explorer  Add New Item, select Web Form, can provide the name of your new page • Change the name of a page • Need to change the class name and “Inherits” directive manually • Set the start page • Single form app, the form is displayed • Or multi-form app, the selected/set one is displayed • Or the default.aspx • Or the directory listing -- need to set a start page • Redirect/Transfer to a different page • Transfer (URL) -- ASPX only, fast because the shift happens at server, address not reflect the actual page • Redirect (URL) – any page, less efficient because the shift happens at the client

4. Some Skills – Cross Page Posting • This is a different approach to move to a different page • The new page’s URL is set in the PostBackUrl property of a button control • Clicking the button results in the loading of a different page specified in the PostBackUrl property • You may have access of the “Previous” Page and controls in the previous page • This tool is used when no user input needs to be processed

5. PageA PageB Cross-page posting Button Previous Page Some Skills – Cross Page Posting • Code for the button • PostBackUrl = “~/PageB.aspx” • Code to refer a control in the previous page Protected void Page_Load(object sender, EventArgs e) { if (PreviousPage != null) { TextBox txtQTY = (TextBox) PreviousPage.FindControl(“txtQTY”); lblQTY.Text = txtQTY.Text; } }

6. Absolute and Relative URLs • Absolute URLs – include domain name • Relative URLs – specify the page relative to the current page

7. About Data Sources • Assume you have a MS SQL Server DB • Having the data to show in a form is very easy – using the smart tag • Work on the smart tag menu to configure • Select database • Select retrieved data/columns

8. About Data Sources

9. Using Data • More on later sections • Make sure the control allows postback • Make sure to bind the control with the data source • Use a Dataview to get the row and column names to get the values in the row

10. The Code protected void Page_Load(object sender, EventArgs e) { if (!IsPostBack) DropDownList1.DataBind(); } protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e) { Product selectedProduct; // show how to use an object to store a row if (DropDownList1.SelectedValue != "") { DataView dvProduct = (DataView) dtsProduct.Select(DataSourceSelectArguments.Empty); dvProduct.RowFilter = "ProductID = '" + DropDownList1.SelectedValue + "'"; DataRowView row = (DataRowView)dvProduct[0]; selectedProduct = new Product(); // initial the obj selectedProduct.UnitPrice = (decimal)row["UnitPrice"]; selectedProduct.LongDescription = row["LongDescription"].ToString(); selectedProduct.ImageFile = row["ImageFile"].ToString(); lblDescription.Text = selectedProduct.LongDescription; lblPrice.Text = selectedProduct.UnitPrice.ToString("c"); imgProduct.ImageUrl = "Images/Products/" + selectedProduct.ImageFile; } }

11. Using Session State • The difference between an Application and a Session • SessionID – unique for each session and kept when a session state is added • It is stored as key/value pair with value being an object • Session[“Cart”] = cart; // cart can be anything, a SortedList here • Session.Add (“Cart”, cart); • SortedList cart = (SortedList) Session[“Cart”]; • SortedList cart = (SortedList) HttpContext.Current.Session[“Cart”]; • Major Property: SessionID, Count, Timeout • Methods: Abandon, Clear, Remove