Thursday, April 1, 2010

Exercise 6: Web Form Design and Processing: A basis for e-commerce interaction

1. Design the form “Retrofit” the form data string below:

"name=Evan+Burke&card=Visa&number=8443261344895544&order=French+perfume"

for buying some French perfume into the HTML form fields and submit button on the Web page form.


As has been the case for a number of exercises thus far, my limited programing background has meant questions such as this one have required quite a bit of research, for what is a very basic outcome. After reading Chapters 6 and 7 in the text (Ince, 2004) had some basic idea of web form design. I then did some research online how to create a html document and ended up eking one out simply using Microsoft Notepad. I did a search on the web for some existing html script that roughly matched what I was after and then basically modified this to "retrofit" the above data string. The resulting script may be viewed at the following link:


French Perfume HTML Script

When this is opened using a browser it looks like this. Not the most attractive website, but I like to think of it as functional.



2. Write the script

Script archives exist for PERL, Python and JavaScript. Search the Web for a script that processes the HTML forms data. Read the code and list the steps involved in processing the form.


After searching some time to find a suitable script for this particular form I managed to find a script that validates the entries of the form and provides a pop-up reminder that certain fields must be completed before submitting the form. The script for this may be viewed at the following link:


JacaScript HTML Form Processing


In terms of the list involved in processing the code, this script is relatively basic. When the user clicks the "Submit" button the script kicks in and checks each field specified in the script for an entry and if it finds an empty field it displays the message "You are required to complete the following fields:" and then inserts the name of any field that is incomplete. If all specifed field are completed, the form is submitted.

3. Can you modify the script to process the form?

This script can be relatively easily modified to process the form. The modified script, including the aforemention Java script is as follows:This script can be relatively easily modified to process the form. The modified script, including the aforemention Java script can be viewed at the floowing link:


HTML Script modfied to include Java


4. Improve the user experience by adding a Javascript feature.


This has already been achieved through question 3 above. This Javascript feature checks the Name and Credit Card fields to make sure the user has completed them. If they haven't, a dialogue box is displayed, prompting the user to complete these fields. This can be seen in the below image:




No comments:

Post a Comment