COMP 3121 EBusiness Technologies Richard Henson University of

  • Slides: 37
Download presentation
COMP 3121 E-Business Technologies Richard Henson University of Worcester November 2011

COMP 3121 E-Business Technologies Richard Henson University of Worcester November 2011

Week 6: Database Design, Server Scripting and Forms Design for Shopping Cart Systems n

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… n

HTML forms and Web forms n HTML forms work at the client end… n Øcollect data in a structured way Østore it as pre-defined data type with specific field name, initially on the local machine 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

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

HTML forms Input-Output syntax n Basic structure: <form> … </form> n Within the form

HTML forms Input-Output syntax n Basic structure: <form> … </form> 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, METHOD tells the form

HTML forms Input-Output syntax 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

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 Ø “code behind” n global. asax css 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

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: <!--#include file="common/copyright. inc"-->

C# “classes” and the Code Behind model n When a. aspx page is requested

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

“Classes” and the Code Behind model

Generating and Running the Page Class Code n When the. aspx page runs, it

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 &

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… »

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 the @ Page directive.

Single-File Pages ØExample: » when a new ASP. NET Web page named Sample. Page

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

Single-File Pages n IF single-file is inside an application subfolder Øsubfolder name is used

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

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…

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 “eventdriven” controls EXAMPLE (an “add to cart” button): protected void

Using C# classes with “eventdriven” controls EXAMPLE (an “add to cart” button): protected void Data. List 1_Item. Command(objectsource, Data. List. Command. Event. Args e) { if (e. Command. Name == "Add. To. Cart") { // Add code here to add the item to the shopping cart. // Use the value of e. Item. Index to retrieve the data // item in the control. } }

The “global. asax” n An optional way of including otherwise unlisted events, objects, with

The “global. asax” n 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 » external users therefore cannot download or view the code in it » makes the settings very secure… n Parsed & compiled at run time Ø dynamically generated. NET class (Http. Application)

Use of Multiple Scripting languages n General rule… DON’T! Ø use of multiple compilers

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

Keep it simple! n Multiple languages ate not even recommended for different pages in

Keep it simple! 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

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

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 Apostrophe for VBScript Ø ‘This is a

Use of Comments in aspx files n Apostrophe for VBScript Ø ‘This is a VBScript comment n Two slashes for JScript Ø //This is a JScript comment n Three slashes for C# n An excellent C# resource: Ø /// <summary> Ø /// The “my. Class” class represents an arbitrary class Ø /// </summary> Ø http: //www. softsteel. co. uk/tutorials/c. Sharp/cont ents. html

“Components” and “Objects” n Very similar and easily confused… Øobject: part of the library

“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 BIG disadvantage of COM (later COM+) components… Ø

Using COM in aspx files 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 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 Microsoft therefore reluctant to give up a good thing and encouraged using COM+ with. net Ø http: //msdn 2. microsoft. com/en-us/library/bb 735856. aspx

Objects n A series of chunks of server script code that will together provide

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

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 “Http. Request” class

ASP. net and directing user input · · In ASP. NET “Http. Request” 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 n Product Information stored on

Using Server Scripting to Create the Shopping System n n Product Information stored on database Script connects to database Products can all be displayed on a page Very useful for users to “click to buy”? Ø how can clicking behaviour be recorded? Ø this is where the shopping cart comes in very handy…

“Shopping Cart” control n A control that sets up the fields that will be

“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 <#include…. >

A pre-compiled cart control n Not only has someone written the C# code for

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 n n One of the more effective tricks of

Parameter Passing between Pages n n n One of the more effective tricks of server scripting pages with multiple records (!) How can a click on a hyperlink send a parameter to the cart with a correct value? 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. Prod. ID

“Click to buy” Scripting n Product page itself needs to be capable of displaying

“Click to buy” Scripting n Product page itself needs to be capable of displaying multiple records Ø “Repeater” control achieves this most effectively Ø associated Product. ID value for a row relates to the record displayed n The “add” function is built into a page called Addfrom. Database. aspx This page has no HTML but triggers an SQL query to: Ø pick up this variable value Ø send the value to the server as Product. ID Ø collect the product description and price fields Ø save all three values to the dataset

Passing the Product ID Parameter Product ID value sent as e. g. “Prod. ID”

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

“Add to Cart” control n This contains the logic to make “click to cart”

“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

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