firstnam
05-15-2012, 05:18 PM
I am trying to set up a form that contains 3 text fields as well as select between two radio spots. I'd like all fields to be required to be filled in as well as (if possible) verify the email is valid. Then after clicking submit I'd like this to go to a url, but only be able to access the url from this form page with all fields complete.
Still new to Javascript sorry! Thanks in advance
<script type="text/javascript">
function validateForm()
{
var x=document.forms["myForm"]["fname"].value;
if (x==null || x=="")
{
alert("First Name must be filled out");
return false;
}
}
{
var x=document.forms["myForm"]["lname"].value;
if (x==null || x=="")
{
alert("Last Name must be filled out");
return false;
}
}
{
var x=document.forms["myForm"]["email"].value;
var atpos=x.indexOf("@");
var dotpos=x.lastIndexOf(".");
if (atpos<1 || dotpos<atpos+2 || dotpos+2>=x.length)
{
alert("Not a valid e-mail address");
return false; }
}
function GetSelectedItem() {
chosen = ""
len = document.f1.r1.length
for (i = 0; i <len; i++) {
if (document.f1.r1[i].checked) {
chosen = document.f1.r1[i].value
}
}
if (chosen == "") {
alert("No Type Chosen")
}
else {
alert(chosen)
}
}
</script>
<table style="width: 300px;" align="center" bgcolor="#FFFFFF" cellpadding="0" cellspacing="0"><form name="myForm" action="https://thecesolution.cecity.com/" onsubmit="returnvalidateForm()" method="get">
<tbody><tr>
<td width="135px"><span style="font-family: Arial,Helvetica,sans-serif; font-size: 12px; padding-left: 15px;">
<strong>First
Name:</strong></span></td>
<td style="width: 165px;"><input name="fname" type="text"></td>
</tr>
<tr>
<td width="135px"> </td>
<td style="width: 165px;"> </td>
</tr>
<tr>
<td><span style="font-family: Arial,Helvetica,sans-serif; font-size: 12px; padding-left: 15px;">
<strong>Last
Name:</strong></span></td>
<td style="width: 165px;"><input name="lname" type="text"></td>
</tr>
<tr>
<td> </td>
<td style="width: 165px;"> </td>
</tr>
<tr>
<td><span style="font-family: Arial,Helvetica,sans-serif; font-size: 12px; padding-left: 15px;">
<strong>Email Address:</strong></span></td>
<td style="width: 165px;"><input name="email" type="text"></td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
<tr>
<td colspan="2" style="padding-left:15px; padding-bottom:7px;"><span style="font-family: Arial,Helvetica,sans-serif; font-size: 12px;">
<strong>Which best describes your workplace?</strong></span></td>
</tr>
<tr>
<td style="text-align: center">
<input type="radio" name="r1" value="location" /><span style="font-family: Arial,Helvetica,sans-serif; font-size: 12px;"><strong> </strong>Independent
<br />
</span></td>
<td style="text-align: center">
<input type="radio" name="r1" value="Franchise" /><span style="font-family: Arial,Helvetica,sans-serif; font-size: 12px;"><strong> </strong>Franchise
<br />
</span></td>
</tr>
<tr>
<td colspan="2" style="padding-top: 15px;" align="center"><input value="Submit" type="submit" onclick="parent.location='https://thecesolution.cecity.com/"></td>
</tr>
</tbody></form></table>
Still new to Javascript sorry! Thanks in advance
<script type="text/javascript">
function validateForm()
{
var x=document.forms["myForm"]["fname"].value;
if (x==null || x=="")
{
alert("First Name must be filled out");
return false;
}
}
{
var x=document.forms["myForm"]["lname"].value;
if (x==null || x=="")
{
alert("Last Name must be filled out");
return false;
}
}
{
var x=document.forms["myForm"]["email"].value;
var atpos=x.indexOf("@");
var dotpos=x.lastIndexOf(".");
if (atpos<1 || dotpos<atpos+2 || dotpos+2>=x.length)
{
alert("Not a valid e-mail address");
return false; }
}
function GetSelectedItem() {
chosen = ""
len = document.f1.r1.length
for (i = 0; i <len; i++) {
if (document.f1.r1[i].checked) {
chosen = document.f1.r1[i].value
}
}
if (chosen == "") {
alert("No Type Chosen")
}
else {
alert(chosen)
}
}
</script>
<table style="width: 300px;" align="center" bgcolor="#FFFFFF" cellpadding="0" cellspacing="0"><form name="myForm" action="https://thecesolution.cecity.com/" onsubmit="returnvalidateForm()" method="get">
<tbody><tr>
<td width="135px"><span style="font-family: Arial,Helvetica,sans-serif; font-size: 12px; padding-left: 15px;">
<strong>First
Name:</strong></span></td>
<td style="width: 165px;"><input name="fname" type="text"></td>
</tr>
<tr>
<td width="135px"> </td>
<td style="width: 165px;"> </td>
</tr>
<tr>
<td><span style="font-family: Arial,Helvetica,sans-serif; font-size: 12px; padding-left: 15px;">
<strong>Last
Name:</strong></span></td>
<td style="width: 165px;"><input name="lname" type="text"></td>
</tr>
<tr>
<td> </td>
<td style="width: 165px;"> </td>
</tr>
<tr>
<td><span style="font-family: Arial,Helvetica,sans-serif; font-size: 12px; padding-left: 15px;">
<strong>Email Address:</strong></span></td>
<td style="width: 165px;"><input name="email" type="text"></td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
<tr>
<td colspan="2" style="padding-left:15px; padding-bottom:7px;"><span style="font-family: Arial,Helvetica,sans-serif; font-size: 12px;">
<strong>Which best describes your workplace?</strong></span></td>
</tr>
<tr>
<td style="text-align: center">
<input type="radio" name="r1" value="location" /><span style="font-family: Arial,Helvetica,sans-serif; font-size: 12px;"><strong> </strong>Independent
<br />
</span></td>
<td style="text-align: center">
<input type="radio" name="r1" value="Franchise" /><span style="font-family: Arial,Helvetica,sans-serif; font-size: 12px;"><strong> </strong>Franchise
<br />
</span></td>
</tr>
<tr>
<td colspan="2" style="padding-top: 15px;" align="center"><input value="Submit" type="submit" onclick="parent.location='https://thecesolution.cecity.com/"></td>
</tr>
</tbody></form></table>