1. COMP3241 E-Commerce Technologies Richard Henson University of Worcester October 2012

2. Week 5: Database Design, Server Scripting and Forms Design for Shopping Cart Systems n Objectives:  Ensure that a consistent data model has been designed as an essential first stage in development  Explain the.net coding required to trap data from HTML forms and write data to specified data fields  Explain the use of asp.net web controls with HTML to allow parameter passing between pages  Create product pages that can pass on data

3. Resolving the Products- Customers relationship n Many databases have failed through lack of knowledge of entity modelling… Product Customer many:many relationship…!!!

4. Link Entity… n Many:many  can be “programmed” from scratch n Not allowed in Relational Databases…  Need a link entity… ProductXYZ (order?)Customer

5. Is one more entity enough? n One customer makes the order  Can make multiple orders  1:many relationship n One or more products make up the order  product and order still many:many n Product & Order need a further entity

6. Shopping Cart Entities n All of this needs to be reflected in shopping cart database design (discuss…)

7. Possible basic data (entity) model for a Shopping System customer Order line order product No entity relationships shown! Where does Shopping Cart fit?

8. Possible Data Model with entities/attributes added

9. Testing the Logical Design with Physical Data… n It works on paper… n But a practical working model is needed:  create database tables  link them together, according to the Entity model you created  populate the tables with trial data of an appropriate format  make sure all is consistent

10. Creating the Physical Database from a Logical Design n Popular options for small(ish) databases:  Microsoft Access »only Access 2000 onwards properly SQL compliant  MySQL »originally shareware for Unix »Also available for Windows n Popular options for larger databases:  SQLServer  ORACLE

11. Essential attributes for Orders Entity n n Like all entities in an entity model…   needs a primary key attribute (orderno.)   needs a foreign key to link with an attribute in another entity » »which attribute?

12. Essential attributes for Orderline Entity n n Primary key attribute? n n Foreign key to link to another entity…   again… which one? n n Each orderline contains other data that needs to be saved in attribute(s) to complete the order. Which attributes?

13. Completing the Data model n n Server scripts will use data from one/more entities   essential that attributes for entities correctly identified n n How can any gaps in the data model be filled in?   important that this is completed before programming starts…

14. Role of Server Scripting in creating Product Pages n After the database has been thoughtfully designed…  it needs to be physically implemented n Server behaviours with appropriate embedded SQL are then required for:  picking the right data out of the remote database  writing data to the appropriate locations in HTML pages on the local client browser

15. Local storage of “remote” data n Asp.net supports local storage of data through the use of datasets  a local copy of various data fields held on one or more data tables on the remote database  simply a local copy of various data fields held on one or more data tables on the remote database  each field becomes a variable in local memory n The dataset fields map directly onto the fields in the remote database  new data can therefore always be stored locally until the appropriate server command is made that writes it to the remote database

16. The Dataset Display (one record) n As you have seen, VWD facilitates the set up of datasets & datagrids n Can then be used to display dataset data on a HTML page, as the shopping cart  a from/further control can be used to create a HTML table for displaying a single record  a navigation bar object can then be added and used to navigate to other records

17. HTML forms and Web forms n HTML forms work at the client end…  collect data in a structured way  store it as pre-defined data type with specific field name, initially on the local machine n Web forms are asp.net constructs  easily created in Visual Studio using.net toolbox  don’t use HTML… in this module we’ll be sticking with HTML forms

18. Care with mapping of data within a HTML form n Structure of a HTML form:  Get/Post tell page where to send the data  text boxes/fieldnames for adding data  button(s) to trigger the sending of data to the location specified by get or post… n Data added to the form can be sent to:  email address  URL of a web server

19. HTML forms Input-Output syntax n Basic structure: … n Basic structure: … n Within the form definition, ACTIONpoints to a URL that will accept the supplied information and do something with it n Within the form definition, ACTION points to a URL that will accept the supplied information and do something with it  it is up to the web server at that website to deduce the type of script from its suffix  the web server then needs to use appropriate software to process it

20. HTML forms Input-Output syntax n Also within the form definition, METHODtells the form how to send its data fields back to the script: n Also within the form definition, METHOD tells the form how to send its data fields back to the script:  POST sends all the information from the form separately from the URL string »could be used with mailto  GET attaches the information from the form to the end of the URL string (max 255 characters)

21. Modular Development of Applications: “code” files in HTML n Existing good code recycled whenever possible…  useful for portability (no point in rewriting…) n Several ways to use settings/code text file called within first.aspx page:  SSI Include global.asax  “code behind” css n Also possible to associate “ready to run” compiled code  “toolbox” controls & “assemblies”

22. The Server-Side #Include (SSI) Directive n Saved as a.inc file  used with multiple asp(x) pages n Syntax: »#INCLUDE directive and either “VIRTUAL” or “FILE” keyword placed inside what would normally be HTML comment tags, with file=“filename” »e.g: »e.g:

23. Using Server Scripting to Create the Shopping System n Product Information stored on database n Script connects to database n Products can all be displayed on a page n Very useful for users to “click to buy”? n How can clicking behaviour be recorded?  coded into the product page & shopping cart  where shopping cart logic comes in very very handy…

24. “Shopping Cart” control n A “ready assembled” web control…  sets up the fields that will be used to store the shopping data n Could have been set up as a code behind file  lot of coding…  why bother if someone has perfected it already!  also, needs to be used by many.aspx pages

25. “Shopping Cart” control n Better off as an assembly  apart from accessed by multiple.aspx pages… »needs to be as fast as possible! n Structure: assemblies added to the App_Data folder  need to be formally included with a page using  need to be formally included with a page using .dll suffix standard for “C” dynamic linked libraries

26. A pre-compiled cart control n Not only has someone written the C# code for a shopping cart for you…  it has already been compiled as well!  found on RH’s website as part of WebXelCart.dll n Contains dataset fields used with specific field and parameter names  need to mesh with corresponding fields on: »product pages… »cart display page

27. “Click to buy” Scripting n Product page itself needs to be capable of displaying multiple records  associated ProductID value for a row relates to the record displayed n Of all available web controls…  “Repeater” control achieves this display most effectively

28. Effect of “Click to Buy” n The “add” function is built into a pre-written page called AddfromDatabase.aspx n This page has no HTML (and therefore no display… but it triggers an SQL query to:  pick up this variable value  send the value to the server as ProductID  collect the product description and price fields  save all three values to the dataset

29. Passing the Product ID Parameter Product Page Add from DB scripts Product ID value sent as e.g. “ProdID” fields extracted from remote database Shopping Cart Remote DB

30. Parameter Passing between Pages (1) n “Click to buy” is one of the more effective tricks of server scripting pages with multiple records (!) n How can a click on a hyperlink send a parameter that adds a series of correct values to the cart? ? ?

31. Parameter Passing (2) n Simple (!) The page uses HTML “get” logic based on a hyperlink used with “?” n Variable name defined in “get” part  corresponds to the primary key in “products” n Role of hyperlink:  picks up the primary key value  allocates this value to the variable used to get the data from the database e.g. ProdID

32. “Add to Cart” control n This contains the logic to make “click to cart” actually happen  other values such as quantity can then be added to the dataset  dataset record will be equivalent to an “orderline”  values for other products can then be stored in the same dataset but with different orderline values n In any case, the result should be a display of the shopping cart contents

33. Displaying the Cart Contents n Another carefully designed web page that displays the cart contents and does some simple calculations  download as cart.aspx  not too different from the product page  uses a repeater and an HTML table to display products data  differences: »the data is displayed from the cart not the products table »line total and grand total fields used to display each item total, and sum total of all line totals

34. Typical RAD tool “errors”… n MUCH can go wrong…!!! n Before embarking on shopping cart development…  need to make sure all local/remote web server settings are correct  screen fields and db fields must use the same format »mustn’t use “reserved words” or punctuation, inc spaces  users must have sufficient access rights to write to the database »this especially includes the “IIS process” user  major adjustments may be needed in response to a minor change in design… »TRUE OF MOST SOFTWARE DEVELOPMENT PROJECTS… »all the more reason to get the design right…

35. Anything else? n One other thing that still need to be covered theoretically is the “C#” code behind model… n Next week… (!)

36. Thanks for listening… n Over the next few weeks, we’ll work on the coding to put this into practice…