CS-3432 Electronic Commerce Lecture – 8 Sikandar Shujah Toor https://sites.google.com/site/uolcsecom
Jan 13, 2016
CS-3432Electronic Commerce
Lecture – 8Sikandar Shujah Toorhttps://sites.google.com/site/uolcsecom
Quiz – 1 30 mins 20 mark1. Define e-commerce and its classes2. What is www? How an http connections is
treated in www per transaction?3. Define and explain OSI network model4. What is a network topology? How many
types of topologies are commonly used ?
3
Forms• A form is a web page populated with the form controls such
as text boxes, drop-down lists, combo boxes, radio buttons, check boxes and commands buttons to get information from the user • <form> and </form>• <Form action=http://www.uol.edu.pk/contact.html
Method=get>• “action” attribute specifies where to send the form data
when the form is submitted• Method attribute specifies how to send form data to the
page specified in action attribute• Two ways to send form data• get – appends the form data into url in name/value pair• not recommended for sensitive data • post – appends the data inside the body of the http request
Forms Controls• Types• Submit/Reset button• Text boxes• Text area • Check boxes• Radio buttons• Lists, etc., etc
Post and Get Methods• <HTML>• <HEAD>• <TITLE>Post and Get Methods</TITLE>• </HEAD>• <BODY>• <H3>An Example of Post and Get methods</H3>• <FORM ACTION="http://www.uol.edu.pk/contact.html" METHOD=“GET">• User Id: <input type="text" name="uid">• <p>Password: <input type="password" name="pwd"></p>• <p><INPUT TYPE="SUBMIT" VALUE=Send-Form></p>• </FORM>• </BODY>• </HTML>
Get Method
7
Example -Submit<HTML><HEAD><TITLE>Submit Button</TITLE></HEAD><BODY><H3>An example of Submit button:</H3><FORM ACTION="http://www.uol.edu.pk/contact.html" METHOD="POST"><INPUT TYPE="SUBMIT" VALUE=Send!></FORM></BODY></HTML>
Submit Button
9
Example – Text Box & Text Area<HTML><HEAD><TITLE>Text Area Example</TITLE></HEAD><BODY><H3>Today's Burning Question</H3><FORM ACTION="http://www.gov.pk/scritps/test.asp" METHOD="POST">First Name: <INPUT TYPE="TEXT" NAME="First"><P>Last Name: <INPUT TYPE="TEXT" NAME="Last"><P>Today's <I>Burning Question</I>: <B>How to make Pakistan a developed country?</B><P>Please enter your answer in the text area below:<BR><TEXTAREA NAME="Answer" ROWS="10" COLS="60"></TEXTAREA><P><INPUT TYPE="SUBMIT" VALUE="I Know!"><INPUT TYPE="RESET"></FORM></BODY></HTML>
Text Boxes & Text Areas
11
Text boxes - Attributes
• <input type=text Name=“URL” Value=http://>
• <Input type=text Name=“address” size=“40”>
• <input type=text Name=“age” maxlength=“3”>
Example – Checkbox<HTML><HEAD><TITLE>CheckBox Example</TITLE></HEAD><BODY><H3>Describe Your Phobia!</H3><FORM ACTION=http://www.sad.com/scripts/formtest.asp METHOD="POST">What is <I>your</I> phobia? (Please check all that apply):<P><INPUT TYPE="CHECKBOX" NAME=“Water">Fear of water<BR><INPUT TYPE="CHECKBOX" NAME="Bald">Fear of becoming bald<BR><INPUT TYPE="CHECKBOX" NAME=“Lock”>Fear of being locked inside<BR><INPUT TYPE="CHECKBOX" NAME="Flying" Checked >Fear of flying<BR><P><INPUT TYPE="SUBMIT" VALUE="Submit"><INPUT TYPE="RESET"></FORM></BODY></HTML>
Example – Checkbox
Example – Radio button<HTML><HEAD><TITLE>Radio Button Example</TITLE></HEAD><BODY><H3>Survey</H3><FORM ACTION="http://www.sad.com/scripts/formtest.asp" METHOD="POST">Which of the following best describes your current income level:<BR><BR><INPUT TYPE="RADIO" NAME=“Income" VALUE="Poverty">living below the poverty line<BR><INPUT TYPE="RADIO" NAME=“Income" VALUE=“Middle” Checked>living at the level of middle class<BR><INPUT TYPE="RADIO" NAME=“Income" VALUE=“Upper">living at the level of upper class<BR><BR>
Which of the following best describes your political inclination:<BR><BR><INPUT TYPE="RADIO" NAME="Politics" VALUE=“Nationalist" CHECKED>Worker of Nationalist Party<BR><INPUT TYPE="RADIO" NAME="Politics" VALUE=“Socialist">Member of Socialist Party<BR><INPUT TYPE="RADIO" NAME="Politics" VALUE=“Republican">Supporter of Republican Party<BR><INPUT TYPE="RADIO" NAME="Politics" VALUE=“None">None of the above<BR><P><INPUT TYPE="SUBMIT" VALUE="Submit"><INPUT TYPE="RESET"></FORM></BODY></HTML>
Example – Radio buttons
Example - Lists<HTML><BODY><FORM ACTION="http://www.sad.com/scripts/formtest.asp" METHOD="POST">Select your nationality:<P><SELECT NAME=“Nationality" SIZE="4"><OPTION>American</OPTION><OPTION>Australian</OPTION><OPTION>Hungarian</OPTION><OPTION>Indian</OPTION><OPTION>Iranian</OPTION><OPTION SELECTED>Pakistani</OPTION><OPTION>French</OPTION></SELECT><P>Select your favorite city:<P><SELECT NAME="City"><OPTION>Sydney</OPTION><OPTION>London</OPTION><OPTION SELECTED>Lahore</OPTION></SELECT><P>
Countries visited last year:<P><SELECT NAME=“Countries" SIZE="5" MULTIPLE><OPTION>Canada</OPTION><OPTION>Russia</OPTION><OPTION>England</OPTION><OPTION>Egypt</OPTION><OPTION>Saudi Arabia</OPTION></SELECT></BODY></HTML>
Example - Lists