Go Back   CodingForums.com > :: Client side development > JavaScript programming

Before you post, read our: Rules & Posting Guidelines

Reply
 
Thread Tools Rate Thread
Enjoy an ad free experience by logging in. Not a member yet? Register.
Old 01-31-2013, 06:17 PM   PM User | #1
gjcluttrell
New Coder

 
Join Date: Mar 2011
Posts: 34
Thanks: 2
Thanked 0 Times in 0 Posts
gjcluttrell is an unknown quantity at this point
Form Field Check

I have a form written in PHP & one of the fields is the last name. I have some javascript that checks & throws a message that says "ATTENTION: Please enter a last name" if the user forgets to enter a last name/leave that field blank. Is there a way I can use javascript to just throw a message that says you must remove the - or ' from this field before continuing. For instance, at this time, in the last name field, if a user does not enter a last name & th esubmit button is pressed, a box pops up saying "Please enter a last name". If there anyway to edit the last name field java code so if the user last a trailing space or a - or a . it will throw a message telling them only letters are allowed in this field? Here is my code. I greatly appreciate your help.


Code:
<html
<head>
<title>New</title>
</head>
</html>

<p> <b><i>To go to the main page <a href="http://tp-o-flow/flow/index.html">click here</a>.</b></i></p>
<b> <i> This is the initial entry page. This information <u> will not </u> notify. </b> </i>

<?php
ini_set('display_errors',1);
error_reporting(E_ALL);

if( isset($_POST) && !empty($_POST) )
{
     $host	= "localhost";
     $user	= "uname";
     $pw	= "password";
     $db	= "flow";
        
     $conn = mysql_connect( $host, $user, $pw )
     or die( "Error! Unable to connect to database server: <br/>" . mysql_error() );

     $rs = mysql_select_db( $db, $conn )
     or die( "Error! Unable to connect to database:  <br/>" . mysql_error() );
          
	foreach($_POST as $key=>$value)
	{
		${$key}=mysql_real_escape_string($value);
	}
	
     $strSQL = "INSERT INTO psrinfo
     	( fname, mname, lname, location, employee, status, oth_date, dock)
     	VALUES
     	( '" . $fname . "', '" . $mname . "', '" . $lname . "',  '" . $location . "', '" .$employee ."', '" .$status ."', '".$oth_date ."', '".$dock."')";
	 	 	 
     if (!mysql_query( $strSQL, $conn )){
     	echo( "Unable to save data to database: <br/>" . mysql_error() . "<br/>" . $strSQL . "</span><br/>" );
     }
     else{
     	header( "Location: index.html" );
		exit;
     }
}
?>
<html>

<head>
<title> Application </title>

<script type="text/javascript">
var valid;

function d2(v) { return (v<10)?("0"+v):v; }

function confirmation() {
		msg="You're about the enter the following information:";
		msg+="\n"; 
		msg+="\ndock: " + document.forms[0].dock.value;
        msg+="\nName: " + document.forms[0].fname.value + " " + document.forms[0].lname.value;
        msg+="\nStatus: " + document.forms[0].status.value;
		msg+="\nLocation: " + document.forms[0].location.value;
		msg+="\nEmployee: " + document.forms[0].employee.value;
		msg+="\nDate: " + document.forms[0].oth_date.value;
		msg+="\n\nIf this information is correct, click OK, if not click cancel to edit.";
		var answer = confirm(msg)
	if (answer){
		// send data to server
	}
	else{
		// don't send anything and return to your page
	}
	
	
	 if(document.forms[0].fname.value == "") {   
                alert("ATTENTION: Please enter a first name.");   
                document.forms[0].fname.focus();  
                return(false)
}

	 if(document.forms[0].mname.value == "") {   
                alert("ATTENTION: Please enter a middle name. If no middle name enter 'none'");   
                document.forms[0].mname.focus();  
                return(false)
}


	 if(document.forms[0].lname.value == "") {   
                alert("ATTENTION: Please enter a last name.");   
                document.forms[0].lname.focus();  
                return(false)

}


	 if(document.forms[0].location.value == "") {   
                alert("ATTENTION: Please choose a location.");   
                document.forms[0].fname.focus();  
                return(false)
}
	
	 if(document.forms[0].employee.value == "") {   
                alert("ATTENTION: Please choose PENDING or UNASSIGNED.");   
                document.forms[0].employee.focus();  
                return(false)
}	
	
	 if(document.forms[0].oth_date.value == "") {   
                alert("ATTENTION: Please enter data in the DATE field. If there is no date, enter 0000-00-00");   
                document.forms[0].oth_date.focus();  
                return(false)
}	
	 if(document.forms[0].dock.value == "") {   
                alert("ATTENTION: Please enter dock NO. If there is no dock NO, enter NO dock");   
                document.forms[0].dock.focus();  
                return(false)
}	



}

</script>

</head>
<body>
<body style="background-image:url(FadedBG.png); background-repeat:no-repeat; background-attachment:fixed; background-position:center;">
<form method="post" action="new.php">

<b>dock No: (Example 210)</b> <br />
<input type="text" name="dock" size="30" /><br />

<b>First Name:</b> <br />
<input type="text" name="fname" size="30" /><br />

<b>Middle Name:</b> <br />
<input type="text" name="mname" size="30" /><br />

<b>Last Name:</b> <br />
<input type="text" name="lname" size="30" /><br />

<b>Status:</b> <br />
<select name="status" /> <br />
<option value="Seal">Seal</option>
<option value="Try">Try</option>
<option value="Sent">Sent</option>
</select>
</br>

<b>Location: </b><br />
<select name="location" /> <br />
<option value="OfficeA">OfficeA</option>
<option value="OfficeB">OfficeB</option> 
<option value="OfficeC">OfficeC</option> 
</select>
</br>

<b>Unassigned or Pending:
<br> </b> 
<select name="employee" /><br />
<option value="Unassigned">Unassigned</option> 
<option value="Pending">Pending</option>
<option value="Unassigned">Unassigned</option>
</select> 
</br> 

<b>Original Date: (Example YYYY-MM-DD)</b> <br />
<input type="text" name="oth_date" size="30" /><br />

<br>

<input type="submit" value="Submit" onclick="return confirmation(this.form);"/>

</form>
</body>
</html>
gjcluttrell is offline   Reply With Quote
Old 01-31-2013, 07:37 PM   PM User | #2
Philip M
Supreme Master coder!

 
Philip M's Avatar
 
Join Date: Jun 2002
Location: London, England
Posts: 17,044
Thanks: 197
Thanked 2,412 Times in 2,390 Posts
Philip M has a spectacular aura aboutPhilip M has a spectacular aura aboutPhilip M has a spectacular aura about
Quote:
Originally Posted by gjcluttrell View Post
If there anyway to edit the last name field java code so if the user last a trailing space or a - or a . it will throw a message
Be aware that Java and Javascript are entirely different programming languages, in spite of the confusingly similar names. Rather like Austria and Australia!

Form validation of the pattern if(document.forms[0].lname.value == "") - that is blank - is barely worthy of the name, and virtually useless, as even a single space, an X or a ? will return false, that is pass the validation. A proper name may only contain letters, hyphen, space and apostrophe.
Numeric values, such as zip codes, phone numbers and dates, should be validated as such. Ditto email addresses. This topic has been covered many times before in this forum.

Forms names are obsolete - use an id rather than a name. Likewise docuemnt.forms[0] is considered undesirable.

To permit only letters, hyphens, apostrophes in a field:

Code:
var lstn = document.forms[0].lname.value;
lstn = lstn.replace(/^\s+|\s+$/g,"");  // strip leading and trailing spaces
lstn = lstn.toLowerCase().replace(/\d[a-z]/g,function(w){return w.toUpperCase()});  // capitalise first letter of each word, other letters lower-case
document.forms[0].lname.value = lstn;  // write it back to the field
if (/[^a-z\-\'\s]/gi.test(lstn)) {  // test for invalid characters
alert ("Only letters, hyphens and apostrophe (and intermediate space) allowed in this field");  // remove \s if spaces not allowed
document.forms[0].lname.value = "";  // clear the field
document.forms[0].lname.focus(); // and refocus on it
return false;
}
All your other fields should be properly validated in a similar way.

See anything wrong here?

Code:
 if(document.forms[0].location.value == "") {   
                alert("ATTENTION: Please choose a location.");   
                document.forms[0].fname.focus();  
                return(false)

All advice is supplied packaged by intellectual weight, and not by volume. Contents may settle slightly in transit.
__________________

All the code given in this post has been tested and is intended to address the question asked.
Unless stated otherwise it is not just a demonstration.

Last edited by Philip M; 01-31-2013 at 07:55 PM..
Philip M is offline   Reply With Quote
Old 01-31-2013, 08:31 PM   PM User | #3
felgall
Master Coder

 
felgall's Avatar
 
Join Date: Sep 2005
Location: Sydney, Australia
Posts: 5,465
Thanks: 0
Thanked 499 Times in 491 Posts
felgall is a jewel in the roughfelgall is a jewel in the roughfelgall is a jewel in the rough
Don't forget that the JavaScript validation is simply for your visitor's convenience so that if they have JavaScript enabled that they get immediate feedback on errors rather than being told about them all after they submit the form. Some visitors (including all those trying to bypass your security on the form) will not have JavaScript available and so you will need to repeat all the validations on the server so as to ensure that the data is actually valid before you use it.
__________________
Stephen
Learn Modern JavaScript - http://javascriptexample.net/
Helping others to solve their computer problem at http://www.felgall.com/
felgall is online now   Reply With Quote
Reply

Bookmarks

Tags
javascript, jscript

Jump To Top of Thread


Thread Tools
Rate This Thread
Rate This Thread:

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT +1. The time now is 10:48 PM.


Advertisement
Log in to turn off these ads.