Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations Rhinorhino on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Form Validation Troubles 1

Status
Not open for further replies.

bam720

Technical User
Joined
Sep 29, 2005
Messages
289
Location
US
I am a php programmer and I have no background in Javascripts. I made this form and my boss told me to put in form validation using java scripts on the page. Here is my attempt but it just submits as if everything is ok.
Code:
html>
<head>
<title>Client Equipment</title>
</head>

<body>
<h2 align="left">Aspex POS Employee Form</h2>
<p align="left"> Client Equipment Information </p>
<p align="left">
<form action="eclientcase.php" method="post" name="mySubmit" style="width:320">
<?php
  	CreateHiddenText("ClientName",$ClientName);
	CreateHiddenText("ClientLoc",$ClientLoc);
	CreateHiddenText("Comp",$Comp);
	CreateHiddenText("OS",$OS);
	CreateHiddenText("AspexVer",$AspexVer);
	CreateHiddenText("MicroChargeVer",$MicroChargeVer);
	CreateHiddenText("Updateformat",$Updateformat);
?>  
  <p>Name: <?php echo $ClientName; ?></p>
  <p>Address: <?php echo $ClientLocation; ?></p>
<?php
	$Cat1 = $_POST['Category1'];
	$Cat2 = $_POST['Category2'];
	$Cat3 = $_POST['Category3'];
	echo '<select name="Category1" onchange="this.form.submit()" selected='.$Cat1.'>';
	echo "<option value=\" \">Choose Category 1</option><br>";
	PopulateCategories(1,"None",$Cat1);
	echo '</select>';
	if($Cat1 != "Other"){
		echo '<p><select name="Category2" onchange="this.form.submit()" selected='.$Cat2.'>';
		echo "<option value=\" \">Choose Category 2</option><br>";
		PopulateCategories(2,$Cat1,$Cat2);
		echo '</select>';
		if($Cat2 != "Other"){
			echo '<p><select name="Category3" onchange="this.form.submit()" selected='.$Cat3.'>';
			echo "<option value=\" \">Choose Category 3</option><br>";
			PopulateCategories(3,$Cat2,$Cat3);
			echo '</select>';
		}else
			echo '<input type="text" name="Category3" id="Category3" value="'.$Cat3.'" onchange="this.form.submit()">';
	}else
		echo '<input type="text" name="Category2" id="Category2" value="'.$Cat2.'" onchange="this.form.submit()">';
?>
</form>
<script language="JavaScript">
<!--
function checkDropdown(sender,choice) {
var error = "";
    if (choice == "") {
    error = "You didn't choose an ".sender." from the drop down list.\n";
    }    
return error;
} 

function isEmpty(sender,strng) {
var error = "";
  if (strng.length == 0) {
     error = "The ".sender." text area has not been filled in.\n";
  }
return error;	  
}

function ValidateForm() {
var error = "";
	error += isEmpty("Category",mySubmit.Cat1.value);
	error += isEmpty("Issue",mySubmit.Issue.value);
	error += isEmpty("Cause",mySubmit.Cause.value);
	error += isEmpty("Resolution",mySubmit.Resolution.value);
	error += isEmpty("Security Level",mySubmit.SecurityLevel.value);
	error += checkDropdown("EmpName",mySubmit.Employee.selectedIndex);
	if(why != ""){
		alert(error);
		return false;
	}
	else return true;
}
//-->
</script> 
<form action="submit.php" method="post" name="mySubmit" onSubmit="return ValidateForm()" style="width:320">
<?php
  	CreateHiddenText("ClientName",$ClientName);
	CreateHiddenText("ClientLoc",$ClientLoc);
	CreateHiddenText("Comp",$Comp);
	CreateHiddenText("OS",$OS);
	CreateHiddenText("AspexVer",$AspexVer);
	CreateHiddenText("MicroChargeVer",$MicroChargeVer);
	CreateHiddenText("Update",$Update);
	CreateHiddenText("Cat1",$Cat1);
	CreateHiddenText("Cat2",$Cat2);
	CreateHiddenText("Cat3",$Cat3);
	CreateHiddenText("Updateformat",$Updateformat);
?>
<p align="left"><strong>Case</strong>
      <select name="CaseStatus">
        <option value='Open' selected>Open</option>
        <option value='Follow Up'>Follow Up</option>
        <option value='Closed'>Closed</option>
      </select> 
  <p>On Site Visit Required: 
  <input type="checkbox" name="OnSiteVisit">  
  <p>On Site Visits Used:
  <?php
  	$Visits = GetClientVal($ClientName,$ClientLoc,"SiteVisits");
  echo $Visits;
  CreateHiddenText("VisitsUsed",$Visits);
  ?>
  <hr>
  <strong>Time Case Opened:</strong> 
  <?php 
  $TimeOpen = date('Y-m-d H:i:s'); 
  $Display = date('g:i:s A \o\n n-j-Y ');
  CreateHiddenText("TimeOpen",$TimeOpen);
  echo $Display;
  ?><br>
    <strong>Issue<br>
  </strong>
    <textarea name="Issue" cols="37" rows="5" id="Issue" onFocus="if(this.value=='Describe the Issue')this.value='';">Describe the Issue</textarea>
  </p>
  <p align="left"><strong>Cause</strong><br>
      <textarea name="Cause" cols="37" rows="5" id="Cause" onFocus="if(this.value=='Possible Causes')this.value='';">Possible Causes</textarea>
  </p>
  <p align="left"><strong>Resolution<br>
        <textarea name="Resolution" cols="37" rows="5" id="Resolution" onFocus="if(this.value=='What fixed it')this.value='';">What fixed it</textarea>
  </strong></p>
  <p align="left">Keywords:<br>
    <input name="Keywords" type="text" id="Keywords" onFocus="if(this.value=='Insert Here')this.value='';" value="Insert Here" size="50">
</p>
  <p align="left">Security Level: (0-255)<br>
      <input name="SecurityLevel" type="text" id="SecurityLevel" onFocus="if(this.value=='Your message')this.value='';" value="100" size="5" maxlength="3">
  </p>
  
  <hr align="left" width="320">
  <p align="left"><strong>Employee Information </strong></p>
  <p align="left">Employee Name:
      <?php
	echo '<select name="EmpName" selected='.$EmpName.'>';
	echo "<option value=\"\">Choose Name</option><br>";
	PopulateDropdown("Employee","Name",'');
	echo "</select>";
?>
  </p>
  <p align="left">
    <input name="Submit" type=submit value="Submit">
  </p>
</form>
</p>
 <a href="user.php">Function List</a>
</body>
</html>

My thoughts on how it is supposed to wrok is that when the submit button is clicked the ValidateForm function is called and processed. Each error line checks out the text box or dropdown and reutrns an error msg (with which area is not filled out). Then the error msg is displayed in an alert popup box. Thanks in advance.
 
Instead of making us sift thru your PHP, why not capture the "view source" that is generated for the browser so that we can see only the client-side stuff? Client side validation is not concerned with server-side processes.

Seeing only the generated HTML would make it much easier to provide you with a script.

-kaht

[small]How spicy would you like your chang sauce? Oh man... I have no idea what's goin' on right now...[/small]
[banghead]
 
I apologize. I didn't even think of that. I do have 3 functions already written though I am not sure if they function as desired. Here is the client side source:
Code:
<html>
<head>
<title>Client Equipment</title>
</head>

<body>
<h2 align="left">Employee Form</h2>
<p align="left"> Client Equipment Information </p>
<p align="left">
<form action="eclientcase.php" method="post" name="mySubmit" style="width:320">
<input type="hidden" name="ClientName" value="CName"><input type="hidden" name="ClientLoc" value="addy"><input type="hidden" name="Comp" value="T2"><input type="hidden" name="OS" value=""><input type="hidden" name="" value="7.2"><input type="hidden" name="" value="6.8"><input type="hidden" name="Updateformat" value="2006-04-05">  
  <p>Name: CName</p>

  <p>Address: Addy</p>
<select name="Category1" onchange="this.form.submit()" selected=><option value=" ">Choose Category 1</option><br><option value="Software">Software</option><br><option value="Hardware">Hardware</option><br><option value="Other">Other</option><br></select><p><select name="Category2" onchange="this.form.submit()" selected=><option value=" ">Choose Category 2</option><br></select><p><select name="Category3" onchange="this.form.submit()" selected=><option value=" ">Choose Category 3</option><br></select></form>
<script language="JavaScript">
<!--
function checkDropdown(sender,choice) {
var error = "";
    if (choice == "") {
    error = "You didn't choose an ".sender." from the drop down list.\n";
    }    
return error;
} 

function isEmpty(sender,strng) {
var error = "";
  if (strng.length == 0) {
     error = "The ".sender." text area has not been filled in.\n";
  }
return error;	  
}

function ValidateForm() {
var error = "";
	error += isEmpty("Category",mySubmit.Cat1.value);
	error += isEmpty("Issue",mySubmit.Issue.value);
	error += isEmpty("Cause",mySubmit.Cause.value);
	error += isEmpty("Resolution",mySubmit.Resolution.value);
	error += isEmpty("Security Level",mySubmit.SecurityLevel.value);
	error += checkDropdown("EmpName",mySubmit.Employee.selectedIndex);
	if(why != ""){
		alert(error);
		return false;
	}
	else return true;
}
//-->
</script> 
<form action="submit.php" method="post" name="mySubmit" onSubmit="return ValidateForm()" style="width:320">
<input type="hidden" name="ClientName" value="CName"><input type="hidden" name="ClientLoc" value="addy"><input type="hidden" name="Comp" value="T2"><input type="hidden" name="OS" value=""><input type="hidden" name="" value="7.2"><input type="hidden" name="MicroChargeVer" value="6.8"><input type="hidden" name="Update" value="Array"><input type="hidden" name="Cat1" value=""><input type="hidden" name="Cat2" value=""><input type="hidden" name="Cat3" value=""><input type="hidden" name="Updateformat" value="2006-04-05"><p align="left"><strong>Case</strong>
      <select name="CaseStatus">

        <option value='Open' selected>Open</option>
        <option value='Follow Up'>Follow Up</option>
        <option value='Closed'>Closed</option>
      </select> 
  <p>On Site Visit Required: 
  <input type="checkbox" name="OnSiteVisit">  
  <p>On Site Visits Used:
  14<input type="hidden" name="VisitsUsed" value="14">  <hr>
  <strong>Time Case Opened:</strong> 
  <input type="hidden" name="TimeOpen" value="2006-04-27 15:30:27">3:30:27 PM on 4-27-2006 <br>

    <strong>Issue<br>
  </strong>
    <textarea name="Issue" cols="37" rows="5" id="Issue" onFocus="if(this.value=='Describe the Issue')this.value='';">Describe the Issue</textarea>
  </p>
  <p align="left"><strong>Cause</strong><br>
      <textarea name="Cause" cols="37" rows="5" id="Cause" onFocus="if(this.value=='Possible Causes')this.value='';">Possible Causes</textarea>
  </p>

  <p align="left"><strong>Resolution<br>
        <textarea name="Resolution" cols="37" rows="5" id="Resolution" onFocus="if(this.value=='What fixed it')this.value='';">What fixed it</textarea>
  </strong></p>
  <p align="left">Keywords:<br>
    <input name="Keywords" type="text" id="Keywords" onFocus="if(this.value=='Insert Here')this.value='';" value="Insert Here" size="50">
</p>
  <p align="left">Security Level: (0-255)<br>

      <input name="SecurityLevel" type="text" id="SecurityLevel" onFocus="if(this.value=='Your message')this.value='';" value="100" size="5" maxlength="3">
  </p>
  
  <hr align="left" width="320">
  <p align="left"><strong>Employee Information </strong></p>
  <p align="left">Employee Name:
      <select name="EmpName" selected=><option value="">Choose Name</option><br><option value="Adriane">Adriane</option><br><option value="Danny">Danny</option><br><option value="Edwin">Edwin</option><br><option value="Mark">Mark</option><br><option value="Rob">Rob</option><br></select>  </p>

  <p align="left">
    <input name="Submit" type=submit value="Submit">
  </p>
</form>
</p>
 <a href="user.php">Function List</a>
</body>
</html>

some data was removed/changed for privacy purposes but it wasn't anything important just names and php values.
Thanks again
 
You gotta switch you thinking from PHP to Javascript:
Code:
error = "You didn't choose an ".sender." from the drop down list.\n";

Change the dot string concatenation operators (.) in your JS code to the plus sign (+) in the 2 lines where you have them.

Lee
 
Thanks for the tip. Chnaged but i still got nothing. I tried running an alert in the ValidateForm function so that I knwo it is being called and I don't get anything. Any ideas?
 
Put alerts before every function call in ValidateForm() to see where the error is. Something like:
Code:
var error = "";
alert(error);

error += isEmpty("Category",mySubmit.Cat1.value);
alert(error);

error += isEmpty("Issue",mySubmit.Issue.value);
alert(error);

error += isEmpty("Cause",mySubmit.Cause.value);
alert(error);

error += isEmpty("Resolution",mySubmit.Resolution.value);
alert(error);

error += isEmpty("Security Level",mySubmit.SecurityLevel.value);
alert(error);

error += checkDropdown("EmpName",mySubmit.Employee.selectedIndex);

Also, what is the variable why that you check in ValidateForm()? I don't see where you declare or assign any value to that.

Lee
 
that was me probably talking to a college and typing what i was syaing instead of what i was thinking. That was one of the critical errors as well as a misnaming.
Code:
error += checkDropdown("EmpName",mySubmit.Employee.selectedIndex);
now reads
Code:
error += checkDropdown("Employee Name",mySubmit.EmpName.selectedIndex);
I picked up on it when I tried your footprinting method. I had alerts 1-7 and it only displayed 1-6 failing at the checkdropwdown line. Is it Javascripts nature to not return an error msg/warning? Thanks again for the help :)
 
If you use FireFox, there's a console included under Tools that shows errors and the line they're on. That would give you similar feedback to what you're used to with PHP, I think.

Each browser has its own Javascript engine, so it's up to the company that made the browser to include error checking for scripts.

Lee
 
i do use Firefox and I never knew that! Yay for FF :)
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top