eg-259:lecture7
Differences
This shows you the differences between two versions of the page.
Both sides previous revisionPrevious revision | Last revisionBoth sides next revision | ||
eg-259:lecture7 [2013/02/12 20:10] – [Form Validation] eechris | eg-259:lecture7 [2013/02/12 20:11] – [Form Validation] eechris | ||
---|---|---|---|
Line 280: | Line 280: | ||
This function checks the validity of phone | This function checks the validity of phone | ||
number input from a form | number input from a form | ||
- | --> | + | --> |
- | <html lang=" | + | < |
< | < | ||
- | <meta charset=" | + | <meta charset=" |
+ | <meta http-equiv=" | ||
< | < | ||
+ | <meta name=" | ||
+ | |||
+ | <link rel=" | ||
+ | <link rel=" | ||
+ | <link rel=" | ||
+ | |||
+ | <script src=" | ||
</ | </ | ||
< | < | ||
- | < | + | |
- | : | + | |
- | <form id=" | + | |
- | | + | < |
- | <label for=" | + | View source to see the HTML code and use your browser' |
- | <input id=" | + | < |
- | title=" | + | |
- | <input type=" | + | </ |
- | </ | + | < |
- | + | | |
- | < | + | <label for=" |
+ | <input id=" | ||
+ | | ||
+ | <input type=" | ||
+ | </ | ||
+ | | ||
+ | |||
+ | <script src="// | ||
+ | < | ||
+ | |||
+ | <script src=" | ||
+ | <script src=" | ||
+ | < | ||
<script src=" | <script src=" | ||
</ | </ | ||
Line 311: | Line 331: | ||
*/ | */ | ||
- | function | + | function |
// Use a simple pattern to check the number of digits and the dash | // Use a simple pattern to check the number of digits and the dash | ||
Line 317: | Line 337: | ||
var ok = num.search(/ | var ok = num.search(/ | ||
- | if(ok == 0) | + | if (ok === 0) { |
return true; | return true; | ||
- | else | + | |
+ | | ||
return false; | return false; | ||
+ | } | ||
+ | | ||
}// end of function tst_phone_num | }// end of function tst_phone_num | ||
/* Actual form validation. Called onclick */ | /* Actual form validation. Called onclick */ | ||
- | var validate = function () { | + | var validate = function() { |
var phoneNumber = document.getElementById(" | var phoneNumber = document.getElementById(" | ||
- | if(tst_phone_num(phoneNumber.value)) { | + | if (test_phone_number(phoneNumber.value)) { |
return true; | return true; | ||
} else { | } else { | ||
alert(" | alert(" | ||
+ | // prevent submission | ||
return false; | return false; | ||
- | // prevents submission | ||
} | } | ||
}; | }; | ||
Line 339: | Line 361: | ||
Test code for '' | Test code for '' | ||
<code javascript> | <code javascript> | ||
- | // Test tst_phone_num -- commented out in production | + | // Test test_phone_number |
- | tests = [" | + | var test_phone_number_test = function() { |
- | for( i = 0; i < tests.length; | + | var tests = [" |
- | var tst = tst_phone_num(tests[i]); | + | for (i = 0; i < tests.length; |
- | if(tst) { | + | var test = test_phone_number(tests[i]); |
- | console.log(tests[i] + " is a legal phone number <br />" | + | if (test) { |
- | } else { | + | console.log(tests[i] + " is a legal phone number <br />" |
- | console.error(" | + | } else { |
+ | console.error(" | ||
+ | } | ||
} | } | ||
- | } | + | }; |
</ | </ | ||
===== HTML5 Pattern Attribute ===== | ===== HTML5 Pattern Attribute ===== |
eg-259/lecture7.txt · Last modified: 2013/02/19 12:29 by eechris