[SOLVED] Why doesn't this input validation work?

kjtocool · December 12, 2007

I am pulling my hair out, I have no idea why this code doesn't work:

JavaScript in header:

<script type="text/javascript">
function verify()
{
with(document.form1)
{
	var message = "";
	var valid = true;

	if ((userName.value == "")) {
			message += "Please enter your username. \n";
			valid = false;
	}

	if ((password.value == "")) {
			message += "Please enter your password. \n";
			valid = false;
	}

	if (valid == false) {
			alert(message);
			return false;
	}
}
}
</script>

The form:

<td class="style7">
						   	<p align="center" class="style9">World of KJ's CMS System </p>
						   	<p align="left" class="style4">System Login: </p>
							<form id="form1" name="form1" method="post" action="loginVal.php">
						   	<table width="100%" border="0" cellspacing="0" cellpadding="0">
								  <tr>
									<td width="15%" class="style7"><span class="style7">Username:</span></td>
									<td width="85%" height="25"><input type="text" name="userName" /></td>
								  </tr>
								  <tr>
									<td class="style7"><span class="style7">Password:</span></td>
									<td height="25"><input type="password" name="password" /></td>
								  </tr>
								  <tr>
									<td> </td>
									<td height="25"><input onclick="return verify();" type="submit" name="Submit" value="Submit" /></td>
								  </tr>
							  </table>
							  </form>
							<p> </p>
							</td>

Full page code:

<?php
session_start();
session_destroy();
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="keywords" content="Movie Reviews, Box Office Previews, Box Office Analysis, Box Office Predictions, Movie News, Movie Box Office">
<title>World of KJ's CMS System</title>
<link rel="Shortcut Icon" href="http://www.worldofkj.com/favicon.ico">

<style type="text/css">
<!--
<? include ("http://www.worldofkj.com/style.php"); ?>
a.special:link {
color: #000000;
text-decoration: none;
}
a.special:visited {
text-decoration: none;
color: #000000;
}
a.special:hover {
text-decoration: none;
color: #0094ff;
}
a.special:active {
text-decoration: none;
}
a.xtinct:link {
color: #0094ff;
text-decoration: none;
}
a.xtinct:visited {
text-decoration: none;
color: #0094ff;
}
a.xtinct:hover {
text-decoration: none;
color: #000000;
}
a.xtinct:active {
text-decoration: none;
}
body {
background-image: url(http://www.worldofkj.com/CS5/images/bg_body.gif);
background-repeat: repeat;
}
.style4 {
color: #0066FF; 
font-family: Arial;
}
.style7 {
font-family: Arial;
font-size: 12px;
color: #000000;
}
.style9 {
color: #0066FF; 
font-family: Arial; 
font-size: 18px; 
}
a:link {
color: #000000;
text-decoration: none;
}
a:visited {
text-decoration: none;
color: #000000;
}
a:hover {
text-decoration: none;
color: #0094ff;
}
a:active {
text-decoration: none;
}
-->
</style>

<script type="text/javascript">
function verify()
{
with(document.form1)
{
	var message = "";
	var valid = true;

	if ((userName.value == "")) {
			message += "Please enter your username. \n";
			valid = false;
	}

	if ((password.value == "")) {
			message += "Please enter your password. \n";
			valid = false;
	}

	if (valid == false) {
			alert(message);
			return false;
	}
}
}
</script>

<? include ("http://www.worldofkj.com/javascript.php"); ?>
</head>

<body onload="MM_preloadImages('http://www.worldofkj.com/CS5/images/menu_articles_r.jpg','http://www.worldofkj.com/CS5/images/menu_news_r.jpg','http://www.worldofkj.com/CS5/images/menu_contests_r.jpg','http://www.worldofkj.com/CS5/images/menu_about_r.jpg','http://www.worldofkj.com/CS5/images/menu_tools_r.jpg','http://www.worldofkj.com/CS5/images/menu_forum_r.jpg')">
<table width="993" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#f8f8f8">
  <tr>
    <td>
  <table width="993" border="0" cellspacing="0" cellpadding="0">
	<!-- Header -->
	<? include ("http://www.worldofkj.com/header.php"); ?>
	<!-- Body -->
	  <tr>
	  <!-- Menu -->
	  <? include ("http://www.worldofkj.com/navigation.php"); ?>
		<!-- Body -->
		<td width="882" valign="top">
	      <table width="882" border="0" cellspacing="0" cellpadding="0">
                <tr>
			<!-- spacer -->
                  <td colspan="3" height="10"></td>
                </tr>
                <tr>
			<!-- Spacer -->
                  <td width="10"></td>
			<!-- Body -->
                  <td>
			  <table width="100%" border="0" cellspacing="0" cellpadding="0">
                    <tr>
                      <td>
				  	<table width="100%" border="0" cellspacing="0" cellpadding="0">
						<tr>
							<td valign="top">
							</td>
						</tr>
					</table>
				  </td>
                      <td width="10" rowspan="4"></td>
                      <td width="130" rowspan="4" valign="top">
				  	<table border="0" cellpadding="0" cellspacing="0" width="98%" align="center">
						<tr>
							<td>
							<center>
							<script type="text/javascript"><!--
							google_ad_client = "pub-4747103003539837";
							google_ad_width = 120;
							google_ad_height = 600;
							google_ad_format = "120x600_as";
							google_ad_type = "text";
							//2007-02-27: Article
							google_ad_channel = "1336028809";
							google_color_border = "f8f8f8";
							google_color_bg = "f8f8f8";
							google_color_link = "0088ff";
							google_color_text = "000000";
							google_color_url = "ffb400";
							//-->
							</script>
							<script type="text/javascript"
							  src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
							</script>
							</center>
							</td>
						</tr>
					</table>
				  </td>
                    </tr>
                    <tr>
                      <td valign="top">
				  <table width="100%" border="0" cellspacing="0" cellpadding="0">
                        <tr>
                          <td><img src="../CS5/images/article_top.jpg" width="721" height="14" /></td>
                        </tr>
                        <tr>
                          <td background="../CS5/images/article_middle.jpg"><table width="97%" border="0" align="center" cellpadding="0" cellspacing="0">
                            <tr>
                            	<td class="style7">
						   	<p align="center" class="style9">World of KJ's CMS System </p>
						   	<p align="left" class="style4">System Login: </p>
							<form id="form1" name="form1" method="post" action="loginVal.php">
						   	<table width="100%" border="0" cellspacing="0" cellpadding="0">
								  <tr>
									<td width="15%" class="style7"><span class="style7">Username:</span></td>
									<td width="85%" height="25"><input type="text" name="userName" /></td>
								  </tr>
								  <tr>
									<td class="style7"><span class="style7">Password:</span></td>
									<td height="25"><input type="password" name="password" /></td>
								  </tr>
								  <tr>
									<td> </td>
									<td height="25"><input onclick="return verify();" type="submit" name="Submit" value="Submit" /></td>
								  </tr>
							  </table>
							  </form>
							<p> </p>
							</td>
                            </tr>
                          </table></td>
                        </tr>
                        <tr>
                          <td><img src="../CS5/images/article_bottom.jpg" width="721" height="14" /></td>
                        </tr>
                      </table>
				  </td>
                    </tr>
                  </table></td>
			  <!-- Spacer -->
                  <td width="10"></td>
                </tr>
			<tr>
			<!-- spacer -->
                  <td colspan="3" height="10"></td>
                </tr>
              </table>
		</td>
		<td width="1" background="http://www.worldofkj.com/CS5/images/menu_spacer_left.jpg"></td>
	  </tr>
	<!-- Footer -->
	<? include ("http://www.worldofkj.com/bottom.php"); ?>
  </table>
</td>
  </tr>
</table>
</body>
</html>

nogray · December 12, 2007

remove the onClick event from the button and add an onSubmit event to the form

<form onSubmit="return verify();" ....

kjtocool · December 12, 2007

Tried, no avail. I have another page page which uses identical code, which works fine. Yet this page just doesn't work, leading me to think something else on the page is doing it, but I have no idea what that could be.

nogray · December 12, 2007

I just tried your script in both Firefox and IE, both works fine. Make sure you don't have any other JS functions that causing the error. Also, you might have the page cached. Try to click "CTRL"+"SHIFT" and hit the reload button.

kjtocool · December 12, 2007

Exactly why I'm pulling my hair out!!!

I tried your suggestion of CTRL + SHIFT + Refresh. A nifty trick I never knew about, but it didn't change anything.

If you looked at my code, I have a PHP Include which includes other JavaScript functions in a new JS script section. That code is for a page rollover, and I use it as an include so if I have to change anything I can simply change it once rather than on thousands of pages. Could that be causing the issue? I've used two JS script sections with validation before and had it work.

Here is that code, it doesn't share function names or anything like that:

<script language="JavaScript" type="text/JavaScript">
<!--
if (document.images) 
{
   Image68 = new Image();
   Image69 = new Image();
   Image70 = new Image();
   Image71 = new Image();
   Image72 = new Image();
   Image73 = new Image();
   Image74 = new Image();
   Image75 = new Image();
   Image76 = new Image();
   Image77 = new Image();
   Image68.src = "http://www.worldofkj.com/CS5/images/menu_home_r.jpg";
   Image69.src = "http://www.worldofkj.com/CS5/images/menu_bo_r.jpg";
   Image70.src = "http://www.worldofkj.com/CS5/images/menu_reviews_r.jpg";
   Image71.src = "http://www.worldofkj.com/CS5/images/menu_articles_r.jpg";
   Image72.src = "http://www.worldofkj.com/CS5/images/menu_news_r.jpg";
   Image73.src = "http://www.worldofkj.com/CS5/images/menu_contests_r.jpg";
   Image74.src = "http://www.worldofkj.com/CS5/images/menu_about_r.jpg";
   Image75.src = "http://www.worldofkj.com/CS5/images/menu_tools_r.jpg";
   Image76.src = "http://www.worldofkj.com/CS5/images/menu_forum_r.jpg";
   Image77.src = "http://www.worldofkj.com/CS5/images/menu_galleries_r.jpg";
}
<!--
function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

//-->

function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>

kjtocool · December 13, 2007

The issue was that I had an include function which included the following:

	<tr>
		<td colspan="5" background="http://www.worldofkj.com/CS5/images/top.jpg" height="100">
			<table width="993" height="97" border="0" cellspacing="0" cellpadding="0">
			  <tr>
				<td width="786" rowspan="2"></td>
				<td width="207" height="90" valign="bottom">
					<form name="form1" method="post" action="http://www.worldofkj.com/search_movies1.php">
					<table cellpadding="0" cellspacing="0" width="100%">
						<tr>
						  <td><input name="textfield" type="text" style="color:#000000" class="style3" value="" /></td>
						  <td><input type="image" src="http://www.worldofkj.com/CS5/images/search.gif" name="Image68" /></td>
						</tr>
					</table>
					</form>					
				</td>
			  </tr>
			  <tr>
				<td height="10"></td>
			  </tr>
		  </table>			
		</td>
	</tr>

You'll notice that the form above is named 'form1', well, so was the form I was trying to validate. That was the source of the error. Only took me about 2 hours to find!

Sign In

[SOLVED] Why doesn't this input validation work?

Recommended Posts

kjtocool

Link to comment

Share on other sites

nogray

Link to comment

Share on other sites

kjtocool

Link to comment

Share on other sites

nogray

Link to comment

Share on other sites

kjtocool

Link to comment

Share on other sites

kjtocool

Link to comment

Share on other sites

Join the conversation

Browse

Activity

Important Information