Starting from:
$24
Assignment 2 Solution
Due: Please check the Instructional Plan
Important Notes:
This is a group assignment. Groups may consist of at most two people. Under no circumstances will groups of 3 or more be permitted.
I will be checking for borrowed or copied assignments. All work is to be done from scratch, you may not use any templates or other assistances.
An in-class demo is required for full marks.
This assessment is out of 20 marks total.
Tasks:
In this assignment, you are to develop an HTML web page that contains one form with many di erent types of input. No action attribute is required in the form, as you won’t have a server set up to respond to your request.
HTML Static Content - Web Form
Form Controls (2.5 marks)
The web form must contain at least 10 controls. The form must include at least 2 text elds and at least 1 of each type of the following: checkbox, radio button, drop-down list.
Mandatory Fields (0.5 marks)
Choose at least 5 of the form controls to be mandatory elds. Clearly identify the mandatory form controls to the user.
Regular Expressions (0.5 marks)
In this assignment you will be using regular expressions to validate at least 2 text elds. For each of these text elds, indicate the pattern of a valid input string.
Cohesiveness (0.5 marks)
Attempt to create a cohesive web form that could be used to collect useful informa-tion. Each form element should make sense in how it is being used. For example, you could create an interactive food menu or an online store.
HTML Event and JavaScript - Focus (1 mark)
When the web page loads, use JavaScript to manually give focus to a form control of your choice. Your decision can be based on any factor including position on the screen, the order of de nition in your HTML source code, etc.
1
PROG1800
JavaScript - Form Validation
Write a JavaScript function that will validate the user input.
Mandatory Fields (1 mark)
Check that each mandatory box is not empty.
Regular Expressions (3 marks)
Use at least 2 regular expressions to validate distinct input text elds.
Meaningful Error Messages (1 mark)
For each situation that can fail, provide a meaningful error message that will help the user to overcome the problem.
Compound Error Message (1.5 marks)
If any errors exist, display a compound message that includes all of the error mes-sages. Do not use a JavaScript popup box for this purpose.
Focus (0.5 marks)
If any errors exist, give focus to one of the o ending form controls.
HTML Event - Form Validation (1 mark)
When the form is submitted, call the previous function to validate the user’s input. If the input is invalid, ensure that no data is sent.
JavaScript - Alphabetic Letter Case Conversion (1 mark)
Write a JavaScript function that will convert all alphabetic characters within an input string to their upper case form and return the result.
HTML Event - Alphabetic Letter Case Conversion (1 mark)
Choose one input text eld. Whenever focus is removed from that text eld and/or when the form is submitted, call the previous function to convert the input string from that text eld.
JavaScript - White Space (1 mark)
Write a JavaScript function that will trim the white space from both sides of an input string and return the result.
HTML Event - White Space (1 mark)
Whenever focus is removed from any applicable control and/or when the form is sub-mitted, call the previous function to trim the user’s input.
JavaScript - Capitalization (1 mark)
Write a JavaScript function that will capitalize each word in an input string and return the result. To be speci c, in the output string the rst character of each word should be upper case and the remaining letters should be lower case.
Programming Style and Standards (1 mark)
It is a good idea to practice conforming to a set of programming standards. Refer to the posted summary of the Programming Standards used by the CP/CPA programs.
2
PROG1800
In-class Demo (1 mark)
Your group must provide in-class demos on or before the due date. Marks will be given for general knowledge of the submitted solution.
Submissions:
To submit this assignment, place all of your work into a single folder. Zip this folder, and submit the zipped le to eConestoga. No cover sheet is required for this assignment. A good way to make sure everything is correct, is to unzip the le you are submitting on a di erent location on your computer and making sure everything works. I have to be able to see your results.
3
Important Notes:
This is a group assignment. Groups may consist of at most two people. Under no circumstances will groups of 3 or more be permitted.
I will be checking for borrowed or copied assignments. All work is to be done from scratch, you may not use any templates or other assistances.
An in-class demo is required for full marks.
This assessment is out of 20 marks total.
Tasks:
In this assignment, you are to develop an HTML web page that contains one form with many di erent types of input. No action attribute is required in the form, as you won’t have a server set up to respond to your request.
HTML Static Content - Web Form
Form Controls (2.5 marks)
The web form must contain at least 10 controls. The form must include at least 2 text elds and at least 1 of each type of the following: checkbox, radio button, drop-down list.
Mandatory Fields (0.5 marks)
Choose at least 5 of the form controls to be mandatory elds. Clearly identify the mandatory form controls to the user.
Regular Expressions (0.5 marks)
In this assignment you will be using regular expressions to validate at least 2 text elds. For each of these text elds, indicate the pattern of a valid input string.
Cohesiveness (0.5 marks)
Attempt to create a cohesive web form that could be used to collect useful informa-tion. Each form element should make sense in how it is being used. For example, you could create an interactive food menu or an online store.
HTML Event and JavaScript - Focus (1 mark)
When the web page loads, use JavaScript to manually give focus to a form control of your choice. Your decision can be based on any factor including position on the screen, the order of de nition in your HTML source code, etc.
1
PROG1800
JavaScript - Form Validation
Write a JavaScript function that will validate the user input.
Mandatory Fields (1 mark)
Check that each mandatory box is not empty.
Regular Expressions (3 marks)
Use at least 2 regular expressions to validate distinct input text elds.
Meaningful Error Messages (1 mark)
For each situation that can fail, provide a meaningful error message that will help the user to overcome the problem.
Compound Error Message (1.5 marks)
If any errors exist, display a compound message that includes all of the error mes-sages. Do not use a JavaScript popup box for this purpose.
Focus (0.5 marks)
If any errors exist, give focus to one of the o ending form controls.
HTML Event - Form Validation (1 mark)
When the form is submitted, call the previous function to validate the user’s input. If the input is invalid, ensure that no data is sent.
JavaScript - Alphabetic Letter Case Conversion (1 mark)
Write a JavaScript function that will convert all alphabetic characters within an input string to their upper case form and return the result.
HTML Event - Alphabetic Letter Case Conversion (1 mark)
Choose one input text eld. Whenever focus is removed from that text eld and/or when the form is submitted, call the previous function to convert the input string from that text eld.
JavaScript - White Space (1 mark)
Write a JavaScript function that will trim the white space from both sides of an input string and return the result.
HTML Event - White Space (1 mark)
Whenever focus is removed from any applicable control and/or when the form is sub-mitted, call the previous function to trim the user’s input.
JavaScript - Capitalization (1 mark)
Write a JavaScript function that will capitalize each word in an input string and return the result. To be speci c, in the output string the rst character of each word should be upper case and the remaining letters should be lower case.
Programming Style and Standards (1 mark)
It is a good idea to practice conforming to a set of programming standards. Refer to the posted summary of the Programming Standards used by the CP/CPA programs.
2
PROG1800
In-class Demo (1 mark)
Your group must provide in-class demos on or before the due date. Marks will be given for general knowledge of the submitted solution.
Submissions:
To submit this assignment, place all of your work into a single folder. Zip this folder, and submit the zipped le to eConestoga. No cover sheet is required for this assignment. A good way to make sure everything is correct, is to unzip the le you are submitting on a di erent location on your computer and making sure everything works. I have to be able to see your results.
3
1 file (6.7KB)
