170 likes | 368 Views
ASP.NET Shopping Cart Service Lecture 2. Chapter 13; pp. 490-522 Profile object as persistent store for cart Shopping cart control The checkout process. Q. Where shall we store the cart? A. The Profile object.
E N D
ASP.NET Shopping Cart ServiceLecture 2 Chapter 13; pp. 490-522 • Profile object as persistent store for cart • Shopping cart control • The checkout process
Q. Where shall we store the cart?A. The Profile object • The shopping cart objects need to be in a persistent store. They need to continue to exist as the user moves from page to page. • Recall (for the 1000th time;-) that HTML is stateless. Thus our choices are: • A cookie • Database records • Session variables (why not application variables?)
Where to store the cart, continued • Cookies may not be permitted on the client machine • Database access can slow processing • The winner – a system maintained persistent object called the Profile • An addition to the Profile’s original function of storing login information • Profiles are explained in Chapter 11, pp. 408-417 and pp. 424-425
Profile addenda DEMO • USB/Chapter 13/end/Web.config – view profile and anonymous ID enabled • USB/Chapter 11/end/Global.asax – view code to allow anonymous shopping with transfer on actual login – the Profile_OnMigrateAnonymous() function • USB/Chapter 13/end/ – view profile fields in ASPNETDB.MDF with database explorer
Shopping function overview Click ‘return to shopping’ Click on item Catalog Page Item Page Click ‘Add to cart’ Cart Page Edit cart Cart & Cart Item Then transfers to page that displays the cart Click event code adds cart item to cart Click ‘checkout’ Checkout Page
Creating the Shopping Cart Control • Since there is no ‘industry standard’ shopping cart protocol, Microsoft does not supply a pre-programmed cart control. • You will build a shopping cart control and then add it to a page • Since you are literally building the control, you must add the code for EVERY function you want it to perform!
Shopping cart control creation • Begin by right-clicking on the application name in the Solution Explorer and thenAdd New Web User Control • The new control behaves like a web page and has both a Source and a Design views. Open it in Design View and drag a GridView control to it. • Note: the designers of the textbook chose a GridView control for the display of the shopping cart. This was a design choice – you are free to make different display choices, for example, DetailsView or a totally custom look with FormView.
Shopping cart control creation (2) • Add GridView fields for ProductName, Quantity, Price, LineTotal (extension), control fields and a thumbnail image. The fields must have the same names as in the CartItem object since you are going to bind the DataGrid to the ShoppingCart object • Now YOU must supply code for the GridView events: • Update (edit) a row (only quantity is editable) • Cancel an edit • Delete a row (if quantity is 0) • Display a message if the cart is empty • Bind the DataGrid to ShoppingCart item data • This code must read, write and edit the ShoppingCart object stored in the session Profile
Shopping cart control creation (3) • To make the control active it must be added to a web page (a standard .aspx page) • Create a new page and drag the control (the .ascx) from the solution explorer onto the new page • Add VB code for the events – see pp. 497-499
Shopping cart control creation • DEMO • USB/Chapter 13/End/WroxUnited/ShopptingCartPage.aspx • Edit the GridView events – the ‘lightning bolt’ in the properties. This is where VB code is added for add, change, delete. • Note that the code updates the Profile-based ShoppingCart and Item objects designed last week • .NET automatically writes the Profile to the disk-based database ASPNETDB.MDF. This is a definite savings of effort – the Item object takes much less code to update than a database. Remember this ‘trick’ – it has multiple uses.
Calling the shopping cart page and ADDing an item to the cart • We now have a nice shopping cart display – but no way to get to it! And no way to add items! • Both problems have the same easy solution • Add a button to the Item display page that: • Has onclick code to add the item to the cart • Transfers control to the shopping cart display
Calling the shopping cart page and ADDing an item to the cart (2) DEMO • USB/WroxUnited/WroxShopItem.aspx • Note: • Code to pull data from controls • Code to add item to ShoppingCart object • Code to transfer control to the WroxShop page
Checking out (pp. 505-523) • When the user has finished shopping the checkout process begins • The checkout activity is a complex subprocess • (force) Login (if not already logged in) • Capture delivery address • Capture payment information • Final confirmation • Post order (to database) and thank customer
Checkout Logic – a brief digression • Automating a complex series of steps, each of which performs multiple functions and requires code to be executed at a specific time is called PROCEDURAL PROGRAMMING • COBOL, C++, Java and JavaScript are all procedural languages – you must handle EVERYTHING including ALL program flow • In contrast, VB is an event-driven language. It handles most of the control logic and the programmer only inserts ‘code fragments’ to be executed in response to events
Checkout Logic – a brief digression (2) • But – sometimes the sequence VB (or .NET) assumes is NOT correct for what you want to do. • Checkout is just such a task – a series of complex subtasks have to be properly sequenced and checked for correctness • The halfa**ed (but functional) solution to this in .NET is the programmable Wizard
Checkout Logic • The Wizard control allows one page to behave as if it were multiple pages, 1 for each Wizard “step” • You add code and controls to each “step” in much the same way as you would to an individual web form • The code behind file for this (checkout) page does is responsible for adding the shopping cart to the disk-based database – using ADO.NET code!
Checkout DEMO • Ch 13/End/Checkout.aspx • NOTE: • The Wizard control – adding steps • The source at each step • The “progress list” of steps down the side of the page • The code behind file