Java for form:
window.onload = init;
function init() {
document.forms[0].onsubmit = submitForm;
}
function calcCost() {
var cost = 145 + (guests_quantity*30);
guests = document.reg.guests;
gindex = guests.selectedIndex;
guests_quantity = guests.options[gindex].value;
if (document.reg.member[0].checked) {
cost = cost - 25;
}
document.reg.total.value = cost;
}
function testLength(field){
if (field.value.length == 0) {
field.style.backgroundColor = "yellow";
return false;
}else {
field.style.backgroundColor = "white";
return true;
}
}
function testPattern(field, reg) {
if (reg.test(field.value) == false) {
field.style.backgroundColor = "yellow";
field.style.color = "red";
return false;
}else {
field.style.backgroundColor = "white";
field.style.color = "black";
return true;
}
}
function submitForm() {
var valid = true;
if (testLength(document.fname)==false){
valid = false;
}
else if (testLength(document.lname)==false){
valid = false;
}
else if (testLength(document.address)==false){
valid = false;
}
else if (testLength(document.email)==false){
valid = false;
}
re = /^\d{3}$/;
if (testPattern (document.phone1, re) == false) {
valid=false;
}
re1 = /^\d{3}$/;
if (testPattern (document.phone2, re1) == false) {
valid = false;
}
re2 = /^\d{4}$/;
if (testPattern (document.phone3, re2) == false) {
valid = false;
}
if (document.member[0].checked || document.member[1].checked == false) {
member[0].style.backgroundColor = "yellow";
member[1].style.backgroundColor = "yellow";
valid= false;
}
if (valid == false){
alert("Enter all required information in the appropriate format");
}else {
calcCost();
}
return valid;
}
HTML for registration:<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<!--
Filename: registration.htm
-->
<head>
<meta name="generator" content="HTML Tidy for Linux (vers 6 November 2007), see www.w3.org" />
<title>NP.Org</title>
<link href="page.css" rel="stylesheet" type="text/css" />
<script src="form.js" type="text/javascript">
</script>
</head>
<body>
<script type="text/javascript">
*/
window.CSSHover=(function(){var m=/(^|\s)((([^a]([^ ]+)?)|(a([^#.][^ ]+)+)):(hover|active|focus))/i;var n=/(.*?)\:(hover|active|focus)/i;var o=/[^:]+:([a-z\-]+).*/i;var p=/(\.([a-z0-9_\-]+):[a-z]+)|(:[a-z]+)/gi;var q=/\.([a-z0-9_\-]*on(hover|active|focus))/i;var s=/msie (5|6|7)/i;var t=/backcompat/i;var u={index:0,list:['text-kashida','text-kashida-space','text-justify'],get:function(){return this.list[(this.index++)%this.list.length]}};var v=function(c){return c.replace(/-(.)/mg,function(a,b){return b.toUpperCase()})};var w={elements:[],callbacks:{},init:function(){if(!s.test(navigator.userAgent)&&!t.test(window.document.compatMode)){return}var a=window.document.styleSheets,l=a.length;for(var i=0;i<l;i++){this.parseStylesheet(a[i])}},parseStylesheet:function(a){if(a.imports){try{var b=a.imports;var l=b.length;for(var i=0;i<l;i++){this.parseStylesheet(a.imports[i])}}catch(securityException){}}try{var c=a.rules;var r=c.length;for(var j=0;j<r;j++){this.parseCSSRule(c[j],a)}}catch(someException){}},parseCSSRule:function(a,b){var c=a.selectorText;if(m.test(c)){var d=a.style.cssText;var e=n.exec(c)[1];var f=c.replace(o,'on$1');var g=c.replace(p,'.$2'+f);var h=q.exec(g)[1];var i=e+h;if(!this.callbacks[i]){var j=u.get();var k=v(j);b.addRule(e,j+':expression(CSSHover(this, "'+f+'", "'+h+'", "'+k+'"))');this.callbacks[i]=true}b.addRule(g,d)}},patch:function(a,b,c,d){try{var f=a.parentNode.currentStyle[d];a.style[d]=f}catch(e){a.runtimeStyle[d]=''}if(!a.csshover){a.csshover=[]}if(!a.csshover[c]){a.csshover[c]=true;var g=new CSSHoverElement(a,b,c);this.elements.push(g)}return b},unload:function(){try{var l=this.elements.length;for(var i=0;i<l;i++){this.elements[i].unload()}this.elements=[];this.callbacks={}}catch(e){}}};var x={onhover:{activator:'onmouseenter',deactivator:'onmouseleave'},onactive:{activator:'onmousedown',deactivator:'onmouseup'},onfocus:{activator:'onfocus',deactivator:'onblur'}};function CSSHoverElement(a,b,c){this.node=a;this.type=b;var d=new RegExp('(^|\\s)'+c+'(\\s|$)','g');this.activator=function(){a.className+=' '+c};this.deactivator=function(){a.className=a.className.replace(d,' ')};a.attachEvent(x[b].activator,this.activator);a.attachEvent(x[b].deactivator,this.deactivator)}CSSHoverElement.prototype={unload:function(){this.node.detachEvent(x[this.type].activator,this.activator);this.node.detachEvent(x[this.type].deactivator,this.deactivator);this.activator=null;this.deactivator=null;this.node=null;this.type=null}};window.attachEvent('onbeforeunload',function(){w.unload()});return function(a,b,c,d){if(a){return w.patch(a,b,c,d)}else{w.init()}}})();
//]]>
</script>
<div id="head">
<div id="clock"><script type="text/javascript">
function doClock() {
var e = document.getElementById('time');
var timeString = showTime(new Date());
e.innerHTML = timeString;
}
function showTime (dateObj) {
var thisSecond=dateObj.getSeconds();
var thisMinute=dateObj.getMinutes();
var thisHour=dateObj.getHours();
var ampm = (thisHour < 12) ? "a.m." : "p.m.";
thisHour = (thisHour > 12) ? thisHour - 12 : thisHour;
thisHour = (thisHour == 0) ? 12 : thisHour;
thisMinute = thisMinute < 10 ? "0"+thisMinute : thisMinute;
thisSecond = thisSecond < 10 ? "0"+thisSecond : thisSecond;
return thisHour + ":" + thisMinute + ":" + thisSecond + " " + ampm;
}
</script> <script type="text/javascript">
window.onload = setInterval(doClock, 1);
</script> <span id="time"></span></div>
<img src="logo.jpg" alt="NP.org" width="640px" height="150px" /></div>
<div id="menu">
<ul>
<li>
<h2>Events</h2>
<ul>
<li><a href="events.htm">Upcoming Events</a></li>
<li><a href="events1.htm">Previous Events</a></li>
</ul>
</li>
</ul>
<ul>
<li>
<h2>Directions</h2>
<ul>
<li><a href="directions.htm">Head Office</a></li>
<li><a href="directions1.htm">501 Broadway</a></li>
</ul>
</li>
</ul>
<ul>
<li>
<h2>Contact Us</h2>
<ul>
<li><a href="contact.htm">Letter/Mail</a></li>
<li><a href="contact1.htm">Phone</a></li>
</ul>
</li>
</ul>
<ul>
<li>
<h2>Registration</h2>
<ul>
<li><a href="registration.htm">Registration Form</a></li>
</ul>
</li>
</ul>
</div>
<div id="main">
<p id="firstp"><br /></p>
<form id="reg" method="get" action="summary.htm">
<div id="main">
<p id="intro">
<center>Investment Oppurtunity Meet and Greet<br />
501 Broadway<br />
July 10, 2011<br />
Entrance Fee: 30$
</p>
<h1>Meet and Greet Form</h1>
<input type="hidden" id="total" name="total" />
<table>
<tr>
<td><span>*</span>First Name</td>
<td><input name="fname" id="fname" /></td>
<td style="text-align: right"><span>*</span>Last</td>
<td><input name="lname" id="lname" /></td>
</tr>
<tr>
<td id="add"><span>*</span>Address</td>
<td colspan="3"><textarea id="address" name="address" rows="" cols=""></textarea></td>
</tr>
<tr>
<td><span>*</span>E-mail</td>
<td colspan="3"><input name="email" id="email" /></td>
</tr>
<tr>
<td><span>*</span>Phone Number</td>
<td colspan="3">
<input id="phone1" name="phone1" size="3" />
<input id="phone2" name="phone2" size="3" /> -
<input id="phone3" name="phone3" size="4" />
</td>
</tr>
<tr>
<td colspan="3">Number attending banquet (add $30 per person)</td>
<td>
<select id="guests" name="guests">
<option>0</option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
</select>
</td>
</tr>
</table>
<p><span>* Required Information</span></p>
<p style="text-align: center"><input id="sbutton" type="submit" value="continue" /></p>
</div>
</form>
<address>NP Organization · 501 Broadway · Nashville, TN 37203 · (615) 770-2000<br><a href="index.htm">HOME</a></address>
</body>
</html>
HTML for summary:<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<!--
Filename: summary.htm
-->
<head>
<meta name="generator" content="HTML Tidy for Linux (vers 6 November 2007), see www.w3.org" />
<title>NP.Org</title>
<link href="page.css" rel="stylesheet" type="text/css" />
<script src="form.js" type="text/javascript">
</script>
</head>
<body>
<script type="text/javascript">
var searchString = location.search.slice(1);
var formString = searchString.replace(/\+/g, " ");
var dataString = unescape(formString);
data = dataString.split(/[&=]/g);
</script>
<script type="text/javascript">
*/
window.CSSHover=(function(){var m=/(^|\s)((([^a]([^ ]+)?)|(a([^#.][^ ]+)+)):(hover|active|focus))/i;var n=/(.*?)\:(hover|active|focus)/i;var o=/[^:]+:([a-z\-]+).*/i;var p=/(\.([a-z0-9_\-]+):[a-z]+)|(:[a-z]+)/gi;var q=/\.([a-z0-9_\-]*on(hover|active|focus))/i;var s=/msie (5|6|7)/i;var t=/backcompat/i;var u={index:0,list:['text-kashida','text-kashida-space','text-justify'],get:function(){return this.list[(this.index++)%this.list.length]}};var v=function(c){return c.replace(/-(.)/mg,function(a,b){return b.toUpperCase()})};var w={elements:[],callbacks:{},init:function(){if(!s.test(navigator.userAgent)&&!t.test(window.document.compatMode)){return}var a=window.document.styleSheets,l=a.length;for(var i=0;i<l;i++){this.parseStylesheet(a[i])}},parseStylesheet:function(a){if(a.imports){try{var b=a.imports;var l=b.length;for(var i=0;i<l;i++){this.parseStylesheet(a.imports[i])}}catch(securityException){}}try{var c=a.rules;var r=c.length;for(var j=0;j<r;j++){this.parseCSSRule(c[j],a)}}catch(someException){}},parseCSSRule:function(a,b){var c=a.selectorText;if(m.test(c)){var d=a.style.cssText;var e=n.exec(c)[1];var f=c.replace(o,'on$1');var g=c.replace(p,'.$2'+f);var h=q.exec(g)[1];var i=e+h;if(!this.callbacks[i]){var j=u.get();var k=v(j);b.addRule(e,j+':expression(CSSHover(this, "'+f+'", "'+h+'", "'+k+'"))');this.callbacks[i]=true}b.addRule(g,d)}},patch:function(a,b,c,d){try{var f=a.parentNode.currentStyle[d];a.style[d]=f}catch(e){a.runtimeStyle[d]=''}if(!a.csshover){a.csshover=[]}if(!a.csshover[c]){a.csshover[c]=true;var g=new CSSHoverElement(a,b,c);this.elements.push(g)}return b},unload:function(){try{var l=this.elements.length;for(var i=0;i<l;i++){this.elements[i].unload()}this.elements=[];this.callbacks={}}catch(e){}}};var x={onhover:{activator:'onmouseenter',deactivator:'onmouseleave'},onactive:{activator:'onmousedown',deactivator:'onmouseup'},onfocus:{activator:'onfocus',deactivator:'onblur'}};function CSSHoverElement(a,b,c){this.node=a;this.type=b;var d=new RegExp('(^|\\s)'+c+'(\\s|$)','g');this.activator=function(){a.className+=' '+c};this.deactivator=function(){a.className=a.className.replace(d,' ')};a.attachEvent(x[b].activator,this.activator);a.attachEvent(x[b].deactivator,this.deactivator)}CSSHoverElement.prototype={unload:function(){this.node.detachEvent(x[this.type].activator,this.activator);this.node.detachEvent(x[this.type].deactivator,this.deactivator);this.activator=null;this.deactivator=null;this.node=null;this.type=null}};window.attachEvent('onbeforeunload',function(){w.unload()});return function(a,b,c,d){if(a){return w.patch(a,b,c,d)}else{w.init()}}})();
//]]>
</script>
<div id="head">
<div id="clock"><script type="text/javascript">
function doClock() {
var e = document.getElementById('time');
var timeString = showTime(new Date());
e.innerHTML = timeString;
}
function showTime (dateObj) {
var thisSecond=dateObj.getSeconds();
var thisMinute=dateObj.getMinutes();
var thisHour=dateObj.getHours();
var ampm = (thisHour < 12) ? "a.m." : "p.m.";
thisHour = (thisHour > 12) ? thisHour - 12 : thisHour;
thisHour = (thisHour == 0) ? 12 : thisHour;
thisMinute = thisMinute < 10 ? "0"+thisMinute : thisMinute;
thisSecond = thisSecond < 10 ? "0"+thisSecond : thisSecond;
return thisHour + ":" + thisMinute + ":" + thisSecond + " " + ampm;
}
</script> <script type="text/javascript">
window.onload = setInterval(doClock, 1);
</script> <span id="time"></span></div>
<img src="logo.jpg" alt="NP.org" width="640px" height="150px" /></div>
<div id="menu">
<ul>
<li>
<h2>Events</h2>
<ul>
<li><a href="events.htm">Upcoming Events</a></li>
<li><a href="events1.htm">Previous Events</a></li>
</ul>
</li>
</ul>
<ul>
<li>
<h2>Directions</h2>
<ul>
<li><a href="directions.htm">Head Office</a></li>
<li><a href="directions1.htm">501 Broadway</a></li>
</ul>
</li>
</ul>
<ul>
<li>
<h2>Contact Us</h2>
<ul>
<li><a href="contact.htm">Letter/Mail</a></li>
<li><a href="contact1.htm">Phone</a></li>
</ul>
</li>
</ul>
<ul>
<li>
<h2>Registration</h2>
<ul>
<li><a href="registration.htm">Registration Form</a></li>
</ul>
</li>
</ul>
</div>
<div id="main">
<p id="firstp"><br /></p>
<center>Investment Oppurtunity Meet and Greet<br />
501 Broadway<br />
July 10, 2011<br />
Entrance Fee: 30$
</p>
</p>
<table id="summary">
<tr><td colspan="2"><h3>Registration Summary</h3></td></tr>
<tr>
<td>Total Conference Cost:</td>
<td>
<script type="text/javascript">
document.write("$" + data[1]);
</script>
</td>
</tr>
<tr>
<td>Name:</td>
<td>
<script type="text/javascript">
document.write(data[3] + " " + data[5]);
</script>
</td>
</tr>
<tr>
<td>Address:</td>
<td>
<script type="text/javascript">
reg = /[\n]/g;
var address = data[7].replace(reg,"<br />");
document.write(address);
</script>
</td>
</tr>
<tr>
<td>E-mail:</td>
<td>
<script type="text/javascript">
document.write(data[9]);
</script>
</td>
</tr>
<tr>
<td>Phone:</td>
<td>
<script type="text/javascript">
document.write("(" + data[11] + ") " + data[13] + "-" + data[15]);
</script>
</td>
</tr>
<tr>
<td>Attending Banquet ($30 per person):</td>
<td>
<script type="text/javascript">
document.write(data[17]);
</script>
</td>
</tr>
</table>
<p>Print this page and retain it for your records.</p>
</div>
<address>NP Organization · 501 Broadway · Nashville, TN 37203 · (615) 770-2000<br><a href="index.htm">HOME</a></address>
</body>
</html>


Sign In
Create Account

Back to top









