introduction to javascript form verification - fort collins, co copyright © xtr systems, llc...
TRANSCRIPT
![Page 1: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/1.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
Verifying SubmittedForm Data
with JavaScript
Instructor: Joseph DiVerdi, Ph.D., MBA
![Page 2: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/2.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
Introduction
• One of the Most Important Uses of JavaScript– Performed Using HTML Event Handlers – Together With JavaScript Functions
• Verification of Form Data Prior to Submission– Important Because
• Preserves Internet Bandwidth• Saves Viewer Time• Good Excuse to Learn JavaScript
![Page 3: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/3.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
Ice Cream Survey Example
• Shortcut to Creating a Copy on Your Site– Use Any Other Procedure If You Prefer
• Examine Basic Survey Form on Course Site– Click on Link to View Page
• Take a Look at the Page
– View Page Source, Select All, & Copy– Open New File on Server with HTML-Kit
• Named survey.html
– Paste into New File & Save
![Page 4: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/4.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
Form Verification Rules
• Ice Cream Flavor Rule– An Ice Cream Flavor Radio Box Must Be Checked
![Page 5: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/5.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
Form Verification Rules
• Toppings Rule– Any Number of Toppings Can Be Checked
• Zero or More
![Page 6: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/6.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
Form Verification Rules
• Name & Email Address Submission Rules– Neither a Name nor Email Address is Required– If Either a Name or Email Address is Supplied
So Must the Other
![Page 7: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/7.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
Form Verification Rules
• Name Rules– A Name Must Consist of Only Alphameric
Characters & Certain Others
a-z A-Z dash quote space
– A Name Must Not Consist Solely of Spaces
![Page 8: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/8.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
Form Verification Rules
• Email Address Rules– A Supplied Email Address Must Be Valid
• For Example
name@mid_domain.top_domain
name@mid_domain1.mid_domain2.top_domain
– Name Must Consist Only ofa-z A-Z 0-9 period dash underscore
– There Must Be One or More mid_domains– mid_domain Must Consist Only of
a-z A-Z 0-9 dash underscore
– top_domain Must Be Two or Three Alphameric Characters
![Page 9: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/9.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
Form Modifications
• Set Form ACTION, NAME, METHOD• Create External JavaScript Directory & File• Add SCRIPT Container For External File• Add ONSUBMIT Event Handler to the Form• Convert Form Variables to JavaScript
Compatible Names• Create JavaScript Functions in File
![Page 10: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/10.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
Edit FORM Tag
• Set Form ACTION, NAME, METHOD• Create External JavaScript Directory & File• Add SCRIPT Container For External File• Add ONSUBMIT Event Handler to the Form• Convert Form Variables to JavaScript
Compatible Names• Create JavaScript Functions in File
![Page 11: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/11.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
Edit FORM Tag
<FORM
ACTION="http://xtrsystems.com/cgi/form_display"
METHOD="POST"
NAME="ice_cream_survey"
>
• ACTION Identifies CGI Program• METHOD Specifies Data Transfer Method• NAME Provides FORM With Identity• Test Survey Now
![Page 12: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/12.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
Create Directory & File
• Set Form ACTION, NAME, METHOD• Create External JavaScript Directory & File• Add SCRIPT Container For External File• Add ONSUBMIT Event Handler to the Form• Convert Form Variables to JavaScript
Compatible Names• Create JavaScript Functions in File
![Page 13: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/13.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
Use External JavaScript
![Page 14: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/14.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
Contents of form_verify.js
// top level function verifying that submitted form data meets rules
function verify(form) {
// if we made it down to this point then everything is OK
return true;
}
![Page 15: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/15.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
Add External Reference
• Set Form ACTION, NAME, METHOD• Create External JavaScript Directory & File• Add SCRIPT Container For External File• Add ONSUBMIT Event Handler to the Form• Convert Form Variables to JavaScript
Compatible Names• Create JavaScript Functions in File
![Page 16: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/16.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
Add External Reference
<!DOCTYPE ... >
<HEAD>
<SCRIPT TYPE="/~name/javascript/form_verify.js"></SCRIPT>
</HEAD>
<BODY>
![Page 17: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/17.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
Add Event Handler
• Set Form ACTION, NAME, METHOD• Create External JavaScript Directory & File• Add SCRIPT Container For External File• Add ONSUBMIT Event Handler to the Form• Convert Form Variables to JavaScript
Compatible Names• Create JavaScript Functions in File
![Page 18: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/18.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
Add Event Handler
<FORM
ACTION="http://xtrsystems.com/cgi/form_display"
METHOD="POST"
NAME="ice_cream_survey"
ONSUBMIT="return verify(ice_cream_survey)"
>
• ONSUBMIT Causes JavaScript Function to Be Executed When Viewer Hits Submit Button
• Test Survey Now
![Page 19: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/19.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
Fix Form Variables
• Set Form ACTION, NAME, METHOD• Create External JavaScript Directory & File• Add SCRIPT Container For External File• Add ONSUBMIT Event Handler to the Form• Convert Form Variables to JavaScript
Compatible Names• Create JavaScript Functions in File
![Page 20: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/20.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
Fix Form Variables
• JavaScript Variable Name Rules– Composed of Any Number of Alphanumerics Plus
The Underscore & Dollar Signa-z A-Z 0-9 _ $
– The First Character Must Not Be a Digit
• Change the FORM Variable Namesice cream flavor -> ice_cream_flavor
email address -> email_address
• Adopt This Convention in Your Future Forms
![Page 21: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/21.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
Form Modifications
• Set Form ACTION, NAME, METHOD• Create External JavaScript Directory & File• Add SCRIPT Container For External File• Add ONSUBMIT Event Handler to the Form• Convert Form Variables to JavaScript
Compatible Names• Create JavaScript Functions in File
![Page 22: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/22.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
Verification Logic Flow
• Perform a Series of Tests in Verify Function• If All Tests Are Passed
– Verify Function Will Return True• FORM ACTION Will be Performed
• If any Test Fails– Verify Function Will Return false
• FORM ACTION Will Not be Performed
– Verify Function Also Brings Up alert window– Verify Function Also Positions Insert Point
• On Offending Input Element
![Page 23: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/23.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
Verification Logic Flow
• Test If an Ice Cream Flavor is Checked– If Checked
• Proceed to Next Test
– If Not Checked• Display Alert• Return False
![Page 24: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/24.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
Verification Logic Flow
• Test Length of Name & Email Address – If Both Equal Zero
• Return True • Perform ACTION
– If Either or Both are Not Equal to Zero • Proceed to Next Test
![Page 25: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/25.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
Verification Logic Flow
• Test Name & Email Address Lengths– If Name Length Not Equal to Zero&
Email Length Equal to Zero• Display Alert• Focus on Name• Return False
![Page 26: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/26.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
Verification Logic Flow
• Test Name & Email Address Lengths– If Name Length Equal to Zero&
Email Length Not Equal to Zero• Display Alert• Focus on Email Address• Return False
![Page 27: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/27.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
Verification Logic Flow
• Proceed to Next Test– If We Arrive at This Point Then
Name & Email Address Lengths Are Both Non-Zero
![Page 28: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/28.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
Verification Logic Flow
• Test if Name is Valid– If Only Contains Whitespace
• Display Alert• Focus on Name• Return False
– Otherwise• Proceed to Next Test
![Page 29: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/29.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
Verification Logic Flow
• Test if Email Address is Valid– If Doesn't Contain Well-Formatted Email Address
• Display Alert• Focus on Email Address• Return False
– Otherwise• All Tests Passed• Return True• Perform ACTION
![Page 30: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/30.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
JavaScript Conditionals
• Use if Statements to Enforce Rulesif (this_statement_is_true)) {
execute_the_statements_found_here;
}
// ensure that a radio button has been checked
if (form_object_is_not_checked(form.ice_cream_flavor)) {
window.alert("You've got to select an ice cream flavor.");
return false;
}
![Page 31: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/31.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
Add Checked Test Code
// top level function verifying that submitted form data meets rules
function verify(form) {
// ensure that a radio button has been checked
if (form_object_is_not_checked(form.ice_cream_flavor)) {
window.alert("You've got to select an ice cream flavor.");
return false;
}
// if we made it down to this point then everything is OK
return true;
}
![Page 32: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/32.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
Add Function
// if we made it down to this point then everything is OK
return true;
}
// function to test if a radio group element has been checked
function form_object_is_not_checked(object) {
for (var item = 0; item < object.length; item++) {
if (object[item].checked) { return false; }
}
return true;
}
![Page 33: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/33.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
Add More Test Code
// ensure that a radio button has been checked
if (form_object_is_not_checked(form.ice_cream_flavor)) {
window.alert("You've got to select an ice cream flavor.");
return false;
}
// 1st case: neither a name or email address has been entered - everything is OK
if (form.name.value.length == 0 &&
form.email_address.value.length == 0) {
return true;
}
// if we made it down to this point then everything is OK
return true;
}
![Page 34: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/34.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
Add More Test Code
// 1st case: neither a name nor email address is entered - everything is OK
if (form.name.value.length == 0 && form.email_address.value.length == 0) {
return true;
}
// 2nd case: only a name has been entered - oops
if (form.name.value.length != 0 &&
form.email_address.value.length == 0) {
window.alert("If you're going to supply a name, you must to supply an email address.");
form.email_address.focus();
return false;
}
// if we made it down to this point then everything is OK
return true;
}
![Page 35: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/35.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
Add More Test Code
return false;
}
// 3rd case: only an email address has been entered - oops
if (form.name.value.length == 0 && form.email_address.value.length != 0) {
window.alert("If you're going to supply an email address, you must to supply a name.");
form.name.focus();
return false;
}
// if we made it down to this point then everything is OK
return true;
}
![Page 36: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/36.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
Add More Test Code
// 3rd case: only an email address has been entered - oops
if (form.name.value.length == 0 && form.email_address.value.length != 0) {
window.alert("If you're going to supply an email address, you must to supply a name.");
form.name.focus();
return false;
}
// 4th case: both a name and email address have been entered
// n.b. there's no need to test for this case because the only way we can find ourselves here
// is if the other three cases failed. Right?
// if we made it down to this point then everything is OK
return true;
}
![Page 37: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/37.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
Add More Test Code
// 4th case: both a name and email address have been entered
// n.b. there's no need to test for this case because the only way we can find ourselves here
// is if the other three cases failed. Right?
// check for a "valid" name
if (!name_is_valid(form.name)) {
window.alert("If you're going to supply a name, it has to be a valid one.");
form.name.focus();
return false;
}
// if we made it down to this point then everything is OK
return true;
}
![Page 38: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/38.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
Add More Test Code
...
if (object[item].checked) { return false; }
}
return true;
}
// regular expression to test for proper formatting of a first name
// n.b. two tests must be passed for this function to return true
// 1. name must not be made solely of blanks
// 2. name must contain only a-z, A-Z, ', -, and space
function name_is_valid(object) {
if (object.value.match(/^\s+$/)) { return false; }
return !object.value.match(/[^a-zA-Z\- ']/);
}
![Page 39: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/39.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
Add More Test Code
if (!name_is_valid(form.name)) {
window.alert("If you're going to supply a name, it has to be a valid one.");
form.name.focus();
return false;
}
// check for a "valid" email address
if (!email_address_is_valid(form.email_address)) {
window.alert("If you're going to supply an email address, it has to be a well formatted one.");
form.email_address.focus();
return false;
}
// if we made it down to this point then everything is OK
return true;
}
![Page 40: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/40.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
Add More Test Code
// regular expression to test for proper formatting of a first name
// n.b. two tests must be passed for this function to return true
// 1. name must not be made solely of blanks
// 2. name must contain no characters other than a-z, A-Z, ', -, and space
function name_is_valid(object) {
if (object.value.match(/^\s+$/)) { return false; }
return !object.value.match(/[^a-zA-Z\- ']/);
}
// regular expression to test for proper formatting of email address
function email_address_is_valid(object) {
return object.value.match(
/^[a-z0-9\-_.]+@(([a-z0-9\-_])+\.)+[a-z]{2,3}$/i);
}
![Page 41: Introduction to JavaScript Form Verification - Fort Collins, CO Copyright © XTR Systems, LLC Verifying Submitted Form Data with JavaScript Instructor:](https://reader036.vdocuments.mx/reader036/viewer/2022062304/56649dc05503460f94ab4411/html5/thumbnails/41.jpg)
Introduction to JavaScriptForm Verification - Fort Collins, CO
Copyright © XTR Systems, LLC
Congratulations
• You have successfully created a complete JavaScript program
• You have learned– How to integrate JavaScript & HTML– How to access several types of HTML objects– How to write JavaScript functions– How to use HTML event handlers