[Okta Webinar] Learn how to a build a cloud-first strategyRegister Now

x
?
Solved

challenge with javascript

Posted on 2011-10-05
8
Medium Priority
?
287 Views
Last Modified: 2012-05-12
I have challenge why this script don't work in site page, but solitary work. I have attached code.
 
<?xml version="1.0" encoding="windows-1252"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
    "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<!-- Created on: 9/19/2011 -->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252" />
<link rel="stylesheet" type="text/css" href="css/main.css" />

<title></title>
<script language="JavaScript" type="text/javascript">


// Javascript validation functions
// http://www.designplace.org/


//function to check empty fields

function isEmpty(strfield1, strfield2, strfield3) {


//change "field1, field2 and field3" to your field names
strfield1 = document.forms[0].field1.value 
strfield2 = document.forms[0].field2.value
strfield3 = document.forms[0].field3.value

  //name field
    if (strfield1 == "" || strfield1 == null || !isNaN(strfield1) || strfield1.charAt(0) == ' ')
    {
    alert("\"Name:\" is a mandatory field.\nPlease amend and retry.")
    return false;
    }

  //url field 
    if (strfield2 == "" || strfield2 == null || strfield2.charAt(0) == ' ')
    {
    alert("\"Surname:\" is a mandatory field.\nPlease amend and retry.")
    return false;
    }

  //title field 
    if (strfield3 == "" || strfield3 == null || strfield3.charAt(0) == ' ')
    {
    alert("\"Message for Company:\" is a mandatory field.\nPlease amend and retry.")
    return false;
    }
    return true;
}


//function to check valid email address
function isValidEmail(strEmail){
  validRegExp = /^[^@]+@[^@]+.[a-z]{2,}$/i;
  strEmail = document.forms[0].email.value;

   // search email text for regular exp matches
    if (strEmail.search(validRegExp) == -1) 
   {
      alert('A valid e-mail address is required.\nPlease amend and retry');
      return false;
    } 
    return true; 
}


//function that performs all functions, defined in the onsubmit event handler

function check(form){
if (isEmpty(form.field1)){
  if (isEmpty(form.field2)){
    if (isEmpty(form.field3)){
		if (isValidEmail(form.email)){
		alert("Form is accepted");
		  return true;
		}
	  }
  }
}
return false;
}

</script>
</head>
<body>
<table width=80% height=80 border="0" align="center" summary="">
	
	<thead>
		<tr>
			<td colspan="2" align="center">
				<img src="images/logo.png" border="0" alt="Company Logo" width=60% />
			</td>
		</tr>
	</thead>
	
	<tfoot>	
		<tr> 
			<td colspan="2" align="right">Copyright Access Technologies Limited 2011</td>
		</tr>
	</tfoot>
	
	<tbody>
		<tr>							  
			<td class="menulist" width=15% valign="top">
				<h3 class="menulist">Main Menu</h3>
				<ul class="menulist">
					<li class="menulist"><a class="menulist" href="home.html">Home</a> </li>
					<li class="menulist"><a class="menulist" href="services.html">Services</a> </li>
					<li class="menulist"><a class="menulist" href="products.html">Products</a> </li>
					<li class="menulist"><a class="menulist" href="articles.html">Articles</a> </li>
					<li class="menulist"><a class="menulist" href="forum.html">Forum</a> </li>		   
					<li class="menulist"><a class="menulist" href="faq.html">FAQ</a> </li>
					<li class="menulist"><a class="menulist" href="feedback.html">Customer Feedback</a> </li>
					<li class="menulist"><a class="menulist" href="home.html">About Us</a> </li>
				</ul>
				<br />		  
			  
				<table width=80%>
					<tr>
						<th colspan="2" align="left">
							<h3 class="menulist">Login</h3>
						</th>
					</tr>	
					<tr>			 
						<td align="right">
							<form name="login" action="validate.asp" method="get">
							Username: 
						</td>
						<td>
							 <input type="text" name="username" size="15" maxlength="15"/>
						</td>
					</tr>
					<tr>
						<td align="right">
							Password: 
						</td> 
						<td>
							<input type="text" name="password" size="15" maxlength="15"/>
						</td>
					</tr>
					<tr>
						<td align="right">
							<input type="submit" value="Submit" />
						</td>			
						<td>
						</td>	
		 				</form>	   
					</tr>
					<tr>					  
						<td colspan="2"><br /><a class="menulist" href="register.html"><h3>Register Now</h3></a> 
					</tr>
				</table>
				<br />
			</td>
			<td>
			<h1>Feedback Form</h1>
				<p>
					To contact us or leave your feedback about our services please fill this form
				</p>
<form name="theform" method="post" action="#" onSubmit="return check(this);">
<p>
					<input type="hidden" name="recipient"
					value="accesstechnologies@gmail.com"/>
					<input type="hidden" name= "subject"
					value="Feedback Form"/>
					<input type ="hidden" name ="redirect"
					value= "main.html"/>			
				</p>
<p>
<label>  Name:
<input name="field1" type="text" />
<label/>
<p/>
  <p>
<label>Surname:
<input name="field2" type="text" />
 <label/>
<p/>
  <p>
<label>
  E-Mail Address: 
  <input name="email" type="text" id="email" />
 <label/>
<p/>
<p>
				    <label> Subject for contact:
					    <select name = "subject">
						    <option selected ="selected">Please Select</option>
						    <option>General enquiry</option>
						    <option>Buying product issues</option>
						    <option>Service information</option>
						    <option>Partnership interest</option>
						    <option>Other</option>   
					   </select>
				    </label>
			    </p>
				<p>
				    <strong>Your interest in web accessibility: </strong></br>
				    <label>Have accessibility issues yourself
					    <input name ="interest" type ="checkbox"
					    value="accessibility"/>
		    		</label>
				    <label>Site development
					    <input name="interest" type="checkbox"
					    value="development"/>
	    		    </label>
				   <label>Commercial interest
					   <input name="interest" type="checkbox"
					   value="commercial"/>
				   </label> 
				   <label>Other
					   <input name="interest" type="checkbox"
					   value="other"/>
				   </label>		    
			    </p>
		    


Message for Company:<br/>
  <textarea name ="field3" type="text" id="field3"rows = "6" cols="52"></textarea>

  <br/>

<input name="submit" type="submit" />
</form>
</td>	
			<!--END OF CONTENT -->
		</tr>
	</tbody>
</table>
  
</body>
</html>

Open in new window

0
Comment
Question by:antatiana
  • 3
  • 2
  • 2
  • +1
8 Comments
 
LVL 9

Expert Comment

by:user_n
ID: 36917886
Can you explain better?
0
 
LVL 22

Expert Comment

by:plusone3055
ID: 36917915
yes please elaborate what is not functioning :)
0
 

Author Comment

by:antatiana
ID: 36917921
when you check this page through editor, javascript will not work here. but if take this code separately it will work. I attached javascipt from this page to see that it works separately.
Compare two these pages in editor.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Javascript Validation</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="robots" content="noindex,follow" />
<script language="JavaScript" type="text/javascript">


// Javascript validation functions
// http://www.designplace.org/


//function to check empty fields

function isEmpty(strfield1, strfield2, strfield3) {


//change "field1, field2 and field3" to your field names
strfield1 = document.forms[0].field1.value 
strfield2 = document.forms[0].field2.value
strfield3 = document.forms[0].field3.value

  //name field
    if (strfield1 == "" || strfield1 == null || !isNaN(strfield1) || strfield1.charAt(0) == ' ')
    {
    alert("\"Name:\" is a mandatory field.\nPlease amend and retry.")
    return false;
    }

  //url field 
    if (strfield2 == "" || strfield2 == null || strfield2.charAt(0) == ' ')
    {
    alert("\"Surname:\" is a mandatory field.\nPlease amend and retry.")
    return false;
    }

  //title field 
    if (strfield3 == "" || strfield3 == null || strfield3.charAt(0) == ' ')
    {
    alert("\"Message for Company:\" is a mandatory field.\nPlease amend and retry.")
    return false;
    }
    return true;
}


//function to check valid email address
function isValidEmail(strEmail){
  validRegExp = /^[^@]+@[^@]+.[a-z]{2,}$/i;
  strEmail = document.forms[0].email.value;

   // search email text for regular exp matches
    if (strEmail.search(validRegExp) == -1) 
   {
      alert('A valid e-mail address is required.\nPlease amend and retry');
      return false;
    } 
    return true; 
}


//function that performs all functions, defined in the onsubmit event handler

function check(form){
if (isEmpty(form.field1)){
  if (isEmpty(form.field2)){
    if (isEmpty(form.field3)){
		if (isValidEmail(form.email)){
		alert("Form is accepted");
		  return true;
		}
	  }
  }
}
return false;
}

</script>
</head>

<h1>Feedback Form</h1>
				<p>
					To contact us or leave your feedback about our services please fill this form
				</p>
<form name="theform" method="post" action="#" onSubmit="return check(this);">
<p>
					<input type="hidden" name="recipient"
					value="accesstechnologies@gmail.com"/>
					<input type="hidden" name= "subject"
					value="Feedback Form"/>
					<input type ="hidden" name ="redirect"
					value= "main.html"/>			
				</p>
<p>
<label>  Name:
<input name="field1" type="text" />
<label/>
<p/>
  <p>
<label>Surname:
<input name="field2" type="text" />
 <label/>
<p/>
  <p>
<label>
  E-Mail Address: 
  <input name="email" type="text" id="email" />
 <label/>
<p/>
<p>
				    <label> Subject for contact:
					    <select name = "subject">
						    <option selected ="selected">Please Select</option>
						    <option>General enquiry</option>
						    <option>Buying product issues</option>
						    <option>Service information</option>
						    <option>Partnership interest</option>
						    <option>Other</option>   
					   </select>
				    </label>
			    </p>
				<p>
				    <strong>Your interest in web accessibility: </strong></br>
				    <label>Have accessibility issues yourself
					    <input name ="interest" type ="checkbox"
					    value="accessibility"/>
		    		</label>
				    <label>Site development
					    <input name="interest" type="checkbox"
					    value="development"/>
	    		    </label>
				   <label>Commercial interest
					   <input name="interest" type="checkbox"
					   value="commercial"/>
				   </label> 
				   <label>Other
					   <input name="interest" type="checkbox"
					   value="other"/>
				   </label>		    
			    </p>
		    


Message for Company:<br/>
  <textarea name ="field3" type="text" id="field3"rows = "6" cols="52"></textarea>

  <br/>

<input name="submit" type="submit" />
</form>

  
</body>
</html>

Open in new window

0
Free Tool: ZipGrep

ZipGrep is a utility that can list and search zip (.war, .ear, .jar, etc) archives for text patterns, without the need to extract the archive's contents.

One of a set of tools we're offering as a way to say thank you for being a part of the community.

 

Author Comment

by:antatiana
ID: 36917940
here is javascript that validate e-mail and entry forms. At first code page it don't work and in second one works.
0
 
LVL 9

Accepted Solution

by:
user_n earned 2000 total points
ID: 36918112
<form name="login" action="validate.asp" method="get"> is not the same as
<form name="theform" method="post" action="#" onSubmit="return check(this);">

http://www.w3schools.com/html/html_forms.asp

Submit Button

<input type="submit" /> defines a submit button.

A submit button is used to send form data to a server. The data is sent to the page specified in the form's action attribute. The file defined in the action attribute usually does something with the received input:
<form name="input" action="html_form_action.asp" method="get">
Username: <input type="text" name="user" />
<input type="submit" value="Submit" />
</form>

How the HTML code above looks in a browser:
Username:
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 36918126
You only allow empty fields. Change the test to return false if a field is empty and return true if all the fields passed the tests
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 36918143
Ps: NEVER call something name="submit" if you ever plan to submit the form from script
0
 

Author Closing Comment

by:antatiana
ID: 36918851
Thank you for your help in rising my mistake.
0

Featured Post

Upgrade your Question Security!

Add Premium security features to your question to ensure its privacy or anonymity. Learn more about your ability to control Question Security today.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

I hope you'll find this tutorial useful and interesting. So let's try to extend Tcl with a new package.  For anyone more deeply interested please check out the book "Practical Programming in Tcl and Tk". It's really one of the best written books abo…
Active Directory replication delay is the cause to many problems.  Here is a super easy script to force Active Directory replication to all sites with by using an elevated PowerShell command prompt, and a tool to verify your changes.
Learn the basics of while and for loops in Python.  while loops are used for testing while, or until, a condition is met: The structure of a while loop is as follows:     while <condition>:         do something         repeate: The break statement m…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
Suggested Courses
Course of the Month19 days, 9 hours left to enroll

873 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question