COMP3121 E-Business Technologies Richard Henson University of Worcester November 2011

Week 6: Database Design, Server Scripting and Forms Design for Shopping Cart Systems n Objectives:  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 a shopping cart  Link a shopping cart with product pages for the transfer and storage of shopping data

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

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:  address  URL of a web server

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

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)

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”

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:

C# “classes” and the Code Behind model n When a.aspx page is requested and renders markup to a browser…  ASP.NET generates & compiles the “classes” that actually perform the tasks required to run the page  the.net framework sets up the JIT run-time environment, and converts code to “intermediate language” (IL) n This means that the code that runs is not solely the code that was created for the.aspx page and its associated “code behind” (!)

“Classes” and the Code Behind model

Generating and Running the Page Class Code n When the.aspx page runs, it has combined:  the server-side elements in the page »e.g. toolbox controls  the event-handling code written as “code behind” n The class or classes that the compiler creates depends on whether the page uses the single-file model or the code-behind model  no need to pre-compile such pages into assemblies!

Generating and Running the Page’s “Class” Code n.NET framework dynamically compiles & runs.aspx pages the first time user requests them:  IF…any changes are subsequently made »either to the page »or resources the page depends on  THEN… the page is automatically recompiled n.NET also supports precompilation of a Web site:  to enhance performance  to perform error checking  to support site deployment

Single-File Pages n When the page is compiled:  the compiler: »generates then… »compiles  EITHER »a new class that derives from the base Page class  OR »a custom base class defined with the Inherits attribute of Page directive.

Single-File Pages  Example: »when a new ASP.NET Web page named SamplePage1 is created in application root directory »then a new class named ASP.SamplePage1_aspx will be derived from the Page class

Single-File Pages n IF single-file is inside an application subfolder  subfolder name is used as part of the generated class »contains declarations for the controls in the.aspx page »contains the event handlers and other custom code

After Page generation… n Generated class…  compiled into an assembly  assembly loaded into the application domain n Page class…  Instantiated  executed  renders output to the browser…

Effect of Page modifications n IF page changes & would affect the generated class… e.g.  adding controls  modifying code n THEN »compiled class code is invalidated »a new class is generated

Using C# classes with “event- driven” controls EXAMPLE (an “add to cart” button): protected void DataList1_ItemCommand(objectsource, DataListCommandEventArgs e) { if (e.CommandName == "AddToCart") { // Add code here to add the item to the shopping cart. // Use the value of e.Item.ItemIndex to retrieve the data // item in the control. }}

The “global.asax” An optional way of including otherwise unlisted events, objects, with application aspx scripts An optional way of including otherwise unlisted events, objects, with application aspx scripts  normally placed in root folder n.NET is configured so that any direct URL request for global.asax automatically rejected n.NET is configured so that any direct URL request for global.asax automatically rejected »external users therefore cannot download or view the code in it »makes the settings very secure… n Parsed & compiled at run time nParsed & compiled at run time dynamically generated.NET class (HttpApplication)

Use of Multiple Scripting languages n n General rule… DON’T!   use of multiple compilers wastes system resources n n If you must:   HTML tag and its LANGUAGE added within the.asp or.aspx code » »RUNAT attributes (where code is executed) optionally added   Usually placed after the tags   Syntax: » » n n script… » »   Similar to embedded client code

Keep it simple! n n Multiple languages ate not even recommended for different pages in the same application…   makes the ASP.net engine load multiple scripting engines   has to then perform more work to determine which piece of script should be sent to which scripting engine!   reduces the responsiveness and scalability of the application

Some Potential Problems of Scripting in the RAD Environment… n Correct scripting language always needs to be defined at the start of the page  dynamic “new” pages provide a range of options n Inserted controls can:  be inserted in the wrong place…  themselves become muddled n Inserted controls may already contain HTML code or (if database) SQL code

Potential Problems of Scripting in the RAD Environment… (continued) n Embedded server script code may depend on a link to a database  link needs to be functioning correctly…  database field types must correspond with script equivalents n If the database tables/fields change significantly, the script must accommodate the field changes…  roll out changes carefully  may be easier to recreate control or whole page…

Use of Comments in aspx files n n Apostrophe for VBScript   ‘ This is a VBScript comment n n Two slashes for JScript   //This is a JScript comment Three slashes for C#   ///   /// The “myClass” class represents an arbitrary class   /// n n An excellent C# resource:   ents.html ents.html

“Components” and “Objects” n Very similar and easily confused…  object: part of the library of files available to the whole application  component: a number of objects »a mini-application in its own right »any instance of a component must be explicitly created before it can be used n Microsoft provide a library of COM components  IIS ASP environment was mostly COM components!

Using COM in aspx files n n BIG disadvantage of COM (later COM+) components…   VB source code so slow & easy to hack   couldn’t be directly used with.net (even VB.net used a slightly different syntax!) n n BUT… popular with developers…   provided consistent, reusable functionality   easy to maintain and share   could be modified or enhanced without affecting the rest of the application n n Microsoft therefore reluctant to give up a good thing and encouraged using COM+ with.net  

Objects n A series of chunks of server script code that will together provide web functionality  available in a number of languages »asp, asp.net »php, cold fusion  Using RAD tools, added to a dynamic HTML page “at the click of a mouse button” n Several objects usually used together to create a useful web application e.g.  data capture form and sending data to database  presentation of data from a database

Evolution of “VBScript Request” object  “Request” was the only way asp scripts could retrieve the input data entered by the user in the input fields in the page  used to access information passed from the browser when requesting a Web page  handles HTML form fields, client certificate information, and cookies

ASP.net and directing user input  In ASP.NET “HttpRequest” class fulfils same function as obsolete asp request  However..  event handling controls  web controls  Provide great flexibility in the manipulation of user input

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”?  how can clicking behaviour be recorded?  this is where the shopping cart comes in very very handy…

“Shopping Cart” control n A control that sets up the fields that will be used to store the shopping data  could be set up as a code behind file  may be better off as an assembly »needs to be accessed by several.aspx pages »needs to be as fast as possible…  assemblies added to the App_Data folder »usually contain a.dll suffix »need to be formally included with »need to be formally included with

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 webxel.dll n Contains quite a lot of dataset fields with specific names  need to be mapped to product pages…  and the cart display page

Parameter Passing between Pages n One of the more effective tricks of server scripting pages with multiple records (!) n How can a click on a hyperlink send a parameter to the cart with a correct value? n Another page uses “get” logic based on a hyperlink with “?”  variable name defined in “get” part  hyperlink picks up the primary key value  allocates this value to the variable used to get the data from the database e.g. ProdID

“Click to buy” Scripting n Product page itself needs to be capable of displaying multiple records  “Repeater” control achieves this most effectively  associated ProductID value for a row relates to the record displayed n The “add” function is built into a page called AddfromDatabase.aspx This page has no HTML but 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

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

“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

Displaying the Cart Contents n Another carefully designed web page that displays the cart contents and does some simple calculations  you can download this as cart.aspx  it is 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