Differences
This shows you the differences between two versions of the page.
Both sides previous revision Previous revision Next revision | Previous revision | ||
playground:playground [2009/02/20 16:18] gsmith28 |
playground:playground [2019/12/18 22:17] (current) |
||
---|---|---|---|
Line 1: | Line 1: | ||
- | ~~NOCACHE~~ | ||
====== PlayGround ====== | ====== PlayGround ====== | ||
- | |||
- | <div align="center"><h1>More Validation of Forms</h1></div> | ||
- | <p>This script carries out various simple checks to try to ensure the fields are filled out correctly. For example, for the URL field, it checks to see if 'http://' is present, and for the e-mail address it looks for the @ symbol. See the comments for how to vary the validation requirements, and how to make the script 'live'; as it is set up at present it just returns a message that all entries are verified OK.</p> | ||
- | <script language="JavaScript" type="text/javascript"> | ||
- | <!-- // hide script from old browsers | ||
- | |||
- | // simple test for address format | ||
- | function testMAIL(form, Ctrl) { | ||
- | if (Ctrl.value == "" || Ctrl.value.indexOf ('@', 0) == -1) { | ||
- | validatePrompt (Ctrl, "Enter a valid email address") | ||
- | return (false); | ||
- | } else | ||
- | return (true); | ||
- | } | ||
- | |||
- | // simple test for URL format | ||
- | function testURL(form, Ctrl) { | ||
- | if (Ctrl.value == "" || Ctrl.value.indexOf("http://",0) == -1) { | ||
- | validatePrompt (Ctrl, "Please provide a valid URL") | ||
- | return (false); | ||
- | } else | ||
- | return (true); | ||
- | } | ||
- | |||
- | // simple test for title existance | ||
- | function testTITLE(form, Ctrl) { | ||
- | if (Ctrl.value == "") { | ||
- | validatePrompt (Ctrl, "Please provide your page's title") | ||
- | return (false); | ||
- | } else | ||
- | return (true); | ||
- | } | ||
- | |||
- | // simple test for password existance | ||
- | function testPASSWD(form, Ctrl) { | ||
- | if (Ctrl.value.length < 4 || Ctrl.value.indexOf(' ',0) != -1) { | ||
- | validatePrompt (Ctrl, "Your password must be at least 4 characters long and contain no whitespace.") | ||
- | return (false); | ||
- | } else | ||
- | return (true); | ||
- | } | ||
- | |||
- | // simple test for keywords existance | ||
- | function testKEYS(form, Ctrl) { | ||
- | if (Ctrl.value == "") { | ||
- | validatePrompt (Ctrl, "You may enter up to 20 keywords.") | ||
- | return (true); // was: false, now field optional | ||
- | } else | ||
- | return (true); | ||
- | } | ||
- | |||
- | // simple test for description existance | ||
- | function testDESC(form, Ctrl) { | ||
- | if (Ctrl.value == "") { | ||
- | validatePrompt (Ctrl, "You may enter a description of your site.") | ||
- | return (true); // was: false, now field optional | ||
- | } else | ||
- | return (true); | ||
- | } | ||
- | |||
- | // test all fields | ||
- | // abort submit on error | ||
- | // submit only if all fields pass tests | ||
- | |||
- | function runSubmit (form) { | ||
- | // if (!testURL(form, form.url)) return; | ||
- | // if (!testTITLE(form, form.title)) return; | ||
- | // if (!testMAIL(form, form.mail)) return; | ||
- | // if (!testPASSWD(form, form.pw)) return; | ||
- | // if (!testKEYS(form, form.keywords)) return; | ||
- | // if (!testDESC(form, form.desc)) return; | ||
- | // alert ("All entries verified OK!"); | ||
- | form.submit(); // un-comment to submit form | ||
- | return; | ||
- | } | ||
- | |||
- | // support routine used during tests | ||
- | function validatePrompt (Ctrl, PromptStr) { | ||
- | alert (PromptStr) | ||
- | Ctrl.focus(); | ||
- | return; | ||
- | } | ||
- | |||
- | // called on document load | ||
- | function loadDoc() { | ||
- | // initial focus; use if needed | ||
- | //document.join.url.focus (); | ||
- | return; | ||
- | } | ||
- | |||
- | // end hiding from old browsers --> | ||
- | </script> | ||
- | <form action="http://pacs.ece.utk.edu/doku.php?id=playground:playground:done" method="POST" name="join"> | ||
- | <!-- Fill in actual HREF for post --> | ||
- | <table border="1"> | ||
- | <tr> | ||
- | <th colspan="2" colstart="1">These fields are | ||
- | required:</th> | ||
- | </tr> | ||
- | <tr> | ||
- | <td align="center" colstart="1">Your page's URL:</td> | ||
- | <td align="center" colstart="2"><input type="text" | ||
- | size="50" name="url"></td> | ||
- | </tr> | ||
- | <tr> | ||
- | <td align="center" colstart="1">Your page's title:</td> | ||
- | <td align="center" colstart="2"><input type="text" | ||
- | size="50" name="title"></td> | ||
- | </tr> | ||
- | <tr> | ||
- | <td align="center" colstart="1">Your e-mail address:</td> | ||
- | <td align="center" colstart="2"><input type="text" | ||
- | size="30" name="mail"></td> | ||
- | </tr> | ||
- | <tr> | ||
- | <td align="center" colstart="1">Password:</td> | ||
- | <td align="center" colstart="2"><input type="text" | ||
- | size="10" name="pw"></td> | ||
- | </tr> | ||
- | <tr> | ||
- | <td align="center" colspan="2" colstart="1">(The | ||
- | password allows you to change info about your site | ||
- | later). <b>Please do not forget it!</b></td> | ||
- | </tr> | ||
- | <tr> | ||
- | <th colspan="2" colstart="1">These fields are | ||
- | optional:</th> | ||
- | </tr> | ||
- | <tr> | ||
- | <td align="center" colstart="1">Enter up to 20 | ||
- | keywords about your site:</td> | ||
- | <td align="center" colstart="2"><input type="text" | ||
- | size="50" name="keywords"></td> | ||
- | </tr> | ||
- | <tr> | ||
- | <td align="center" colstart="1">Enter a short | ||
- | description of your site.</td> | ||
- | <td align="center" colstart="2"><textarea name="desc" | ||
- | rows="5" cols="42" wrap="soft"></textarea></td> | ||
- | </tr> | ||
- | <tr> | ||
- | <td align="center" colspan="2" colstart="1"><input | ||
- | type="button" name="Submit" | ||
- | value="Submit this information" | ||
- | onclick="runSubmit(this.form)"> </td> | ||
- | </tr> | ||
- | </table> | ||
- | </form> | ||
- | |||
- | |||
- | </html> | ||
- | |||
- | |||
- | <php> | ||
- | $rows=5; | ||
- | $columns=2; | ||
- | |||
- | echo "\n<table class=\"inline\">\n"; | ||
- | |||
- | for($i = 0; $i < $rows; $i++){ | ||
- | echo ("<tr class=\"row".$i.$j."\">\n"); | ||
- | if($i == 0){ | ||
- | for($j = 0; $j < $columns; $j++){ | ||
- | echo ("<th class=\"col".$j." leftalign\">Item ".$i.$j."</th>\n"); | ||
- | } | ||
- | }else{ | ||
- | for($j = 0; $j < $columns; $j++){ | ||
- | echo ("<td class=\"col".$j." leftalign\">Item ".$i.$j."</td>\n"); | ||
- | } | ||
- | } | ||
- | echo ("</tr>\n"); | ||
- | } | ||
- | echo "</table>"; | ||
- | </php> | ||
- | |||
- | ^ Heading 1 ^ Heading 2 ^ Heading 3 ^ | ||
- | | Row 1 Col 1 | Row 1 Col 2 | Row 1 Col 3 | | ||
- | | Row 2 Col 1 | some colspan (note the double pipe) || | ||
- | | Row 3 Col 1 | Row 2 Col 2 | Row 2 Col 3 | | ||