Validation/insert problem

witchy478 · March 18, 2012

Hi

My problem is that I can't insert my information into my database. I was able to insert the information into my database last night but when I tried to use validation it's not working any more.

Here is my code for the sign up

<?php
require_once("validation.php");
?>

<!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" dir="ltr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>yensdesign.com - Validate Forms using PHP and jQuery</title>
<link rel="stylesheet" href="css/general.css" type="text/css" media="screen" />
</head>
<body>
<a id="logo" title="Go to yensdesign.com!" href="http://www.yensdesign.com"><img src="css/images/logo.jpg" alt="yensdesign.com" /></a>
<div id="container">
	<h1>Registration process</h1>

	<?if( isset($_POST['send']) && (!validateName($_POST['name']) || !validateEmail($_POST['email']) || !validatePasswords($_POST['pass1'], $_POST['pass2']) || !validateMessage($_POST['message']) ) ):?>
			<div id="error">
				<ul>
					<?if(!validateName($_POST['name'])):?>
						<li><strong>Invalid Name:</strong> We want names with more than 3 letters!</li>
					<?endif?>
					<?if(!validateEmail($_POST['email'])):?>
						<li><strong>Invalid E-mail:</strong> Stop cowboy! Type a valid e-mail please </li>
					<?endif?>
					<?if(!validatePasswords($_POST['pass1'], $_POST['pass2'])):?>
						<li><strong>Passwords are invalid:</strong> Passwords doesn't match or are invalid!</li>
					<?endif?>
					<?if(!validateMessage($_POST['message'])):?>
						<li><strong>Ivalid message:</strong> Type a message with at least with 10 letters</li>
					<?endif?>
				</ul>
			</div>
		<?elseif(isset($_POST['send'])):?>
			<div id="error" class="valid">
				<ul>
					<li><strong>Congratulations!</strong> All fields are OK </li>
				</ul>
			</div>
	<?endif?>

	<form method="post" id="customForm" action="index.php">
		<div>
			Name
			<input id="name" name="name" type="text" />
			<!--<span id="nameInfo">What's your name?</span>-->
		</div>
		<div>
			E-mail
			<input id="email" name="email" type="text" />
			<!--<span id="emailInfo">Valid E-mail please, you will need it to log in!</span>-->
		</div>
		<div>
			Password
			<input id="pass1" name="password" type="password" />
			<span id="pass1Info">At least 5 characters: letters, numbers and '_'</span>
		</div>
		<div>
			Confirm Password
			<input id="pass2" name="pass2" type="password" />
			<span id="pass2Info">Confirm password</span>
		</div>
		<!--<div>
			<label for="message">Message</label>
			<textarea id="message" name="message" cols="" rows=""></textarea>
		</div>-->
		<div>
			<input id="send"  type="submit" value="Send" />
		</div>
	</form>
</div>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="validation.js"></script>
</body>
</html>
<?php

$host="localhost"; // Host name 
$username=""; // Mysql username 
$password=""; // Mysql password 
$db_name="test"; // Database name 
$tbl_name="emails"; // Table name

// Connect to server and select database.
mysql_connect("$host", "$username", "$password")or die("cannot connect"); 
mysql_select_db("$db_name")or die("cannot select DB");

// Get values from form 
$name=$_POST['name'];
$email=$_POST['email'];
$password=$_POST['password'];

// Insert data into mysql 
$sql="INSERT INTO $tbl_name(name, email, password)VALUES('$name', '$email', 'password')";
$result=mysql_query($sql);

// if successfully insert data into database, displays message "Successful". 
if($result){
echo "Successful";
echo "<BR>";
echo "<a href='insert.php'>Back to main page</a>";
}

else {
echo "ERROR";
}

// close connection 
mysql_close();
?>

This is the validation.php

<?php
function validateName($name){
	//if it's NOT valid
	if(strlen($name) < 4)
		return false;
	//if it's valid
	else
		return true;
}
function validateEmail($email){
	return ereg("^[a-zA-Z0-9]+[a-zA-Z0-9_-]+@[a-zA-Z0-9]+[a-zA-Z0-9.-]+[a-zA-Z0-9]+.[a-z]{2,4}$", $email);
}
function validatePasswords($pass1, $pass2) {
	//if DOESN'T MATCH
	if(strpos($pass1, ' ') !== false)
		return false;
	//if are valid
	return $pass1 == $pass2 && strlen($pass1) > 5;
}
function validateMessage($message){
	//if it's NOT valid
	if(strlen($message) < 10)
		return false;
	//if it's valid
	else
		return true;
}
?>

And this is the validation.js

/***************************/
//@Author: Adrian "yEnS" Mato Gondelle & Ivan Guardado Castro
//@website: www.yensdesign.com
//@email: [email protected]
//@license: Feel free to use it, but keep this credits please!					
/***************************/

$(document).ready(function(){
//global vars
var form = $("#customForm");
var name = $("#name");
var nameInfo = $("#nameInfo");
var email = $("#email");
var emailInfo = $("#emailInfo");
var pass1 = $("#pass1");
var pass1Info = $("#pass1Info");
var pass2 = $("#pass2");
var pass2Info = $("#pass2Info");
var message = $("#message");

//On blur
name.blur(validateName);
email.blur(validateEmail);
pass1.blur(validatePass1);
pass2.blur(validatePass2);
//On key press
name.keyup(validateName);
pass1.keyup(validatePass1);
pass2.keyup(validatePass2);
message.keyup(validateMessage);
//On Submitting
form.submit(function(){
	if(validateName() & validateEmail() & validatePass1() & validatePass2() & validateMessage())
		return true
	else
		return false;
});

//validation functions
function validateEmail(){
	//testing regular expression
	var a = $("#email").val();
	var filter = /^[a-zA-Z0-9]+[a-zA-Z0-9_.-]+[a-zA-Z0-9_-]+@[a-zA-Z0-9]+[a-zA-Z0-9.-]+[a-zA-Z0-9]+.[a-z]{2,4}$/;
	//if it's valid email
	if(filter.test(a)){
		email.removeClass("error");
		emailInfo.text("Valid E-mail please, you will need it to log in!");
		emailInfo.removeClass("error");
		return true;
	}
	//if it's NOT valid
	else{
		email.addClass("error");
		emailInfo.text("Stop cowboy! Type a valid e-mail please ");
		emailInfo.addClass("error");
		return false;
	}
}
function validateName(){
	//if it's NOT valid
	if(name.val().length < 4){
		name.addClass("error");
		nameInfo.text("We want names with more than 3 letters!");
		nameInfo.addClass("error");
		return false;
	}
	//if it's valid
	else{
		name.removeClass("error");
		nameInfo.text("What's your name?");
		nameInfo.removeClass("error");
		return true;
	}
}
function validatePass1(){
	var a = $("#password1");
	var b = $("#password2");

	//it's NOT valid
	if(pass1.val().length <5){
		pass1.addClass("error");
		pass1Info.text("Ey! Remember: At least 5 characters: letters, numbers and '_'");
		pass1Info.addClass("error");
		return false;
	}
	//it's valid
	else{			
		pass1.removeClass("error");
		pass1Info.text("At least 5 characters: letters, numbers and '_'");
		pass1Info.removeClass("error");
		validatePass2();
		return true;
	}
}
function validatePass2(){
	var a = $("#password1");
	var b = $("#password2");
	//are NOT valid
	if( pass1.val() != pass2.val() ){
		pass2.addClass("error");
		pass2Info.text("Passwords doesn't match!");
		pass2Info.addClass("error");
		return false;
	}
	//are valid
	else{
		pass2.removeClass("error");
		pass2Info.text("Confirm password");
		pass2Info.removeClass("error");
		return true;
	}
}
function validateMessage(){
	//it's NOT valid
	if(message.val().length < 10){
		message.addClass("error");
		return false;
	}
	//it's valid
	else{			
		message.removeClass("error");
		return true;
	}
}
});

I also get that the name, email and password is undefined

trq · March 18, 2012

Your trying to use PHP functions in JavaScript. That aint going to happen.

trq · March 18, 2012

Scratch that. I missed the part where you define functions of the same name in JavaScript.

witchy478 · March 18, 2012

Do you know what I did wrong and how I can fix it

trq · March 18, 2012

Without a description of the problem, no.

witchy478 · March 18, 2012

the problem is that I get undefined name, undefined email and undefined password and the information doesn't get put into the database

witchy478 · March 18, 2012

I have managed to get the form to save the data but I still get the undefined name, undefined email and undefined password and now instead of saving one row it ends up saving a couple of rows. If that makes sense.

Here is the code I used for the form

<?php 
####################################################################
# THIS SCRIPT CREATED BY WWW.WEBUNE.COM 
# PLEASE DONT ERASE THIS 
###################################################################
####################################################################
################ DATABASE CONFIGURE ##############################
####################################################################
$hostname = "localhost"; // usually is localhost, but if not sure, check with your hosting company, if you are with webune leave as localhost 
$db_user = ""; // change to your database password 
$db_password = ""; // change to your database password 
$database = "test"; // provide your database name 
$db_table = "emails"; // leave this as is 


# STOP HERE 
####################################################################
# THIS CODE IS USED TO CONNECT TO THE MYSQL DATABASE 
$db = mysql_connect($hostname, $db_user, $db_password); 
mysql_select_db($database,$db); 
?> 
<?php
require_once("validation.php");
?>

<!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" dir="ltr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>yensdesign.com - Validate Forms using PHP and jQuery</title>
<link rel="stylesheet" href="css/general.css" type="text/css" media="screen" />
</head>
<body>
<?php 
if (isset($_REQUEST['Submit'])) { 
# THIS CODE TELL MYSQL TO INSERT THE DATA FROM THE FORM INTO YOUR MYSQL TABLE 
$sql = "INSERT INTO $db_table(name, email, password) values ('".mysql_real_escape_string(stripslashes($_REQUEST['name']))."','".mysql_real_escape_string(stripslashes($_REQUEST['email']))."','".mysql_real_escape_string(stripslashes($_REQUEST['password']))."')";
if($result = mysql_query($sql ,$db)) { 
echo '<h1>Thank you</h1>Your information has been entered into our database<br><br><img src="http://www.webune.com/images/headers/default_logo.jpg"'; 
} else { 
echo "ERROR: ".mysql_error(); 
} 
} else { 
?> 
<a id="logo" title="Go to yensdesign.com!" href="http://www.yensdesign.com"><img src="css/images/logo.jpg" alt="yensdesign.com" /></a>
<div id="container">
	<h1>Registration process</h1>



	<form method="post" id="customForm" action="insert.php">
		<div>
			Name
			<input id="name" name="name" type="text" />
			<!--<span id="nameInfo">What's your name?</span>-->
		</div>
		<div>
			E-mail
			<input id="email" name="email" type="text" />
			<!--<span id="emailInfo">Valid E-mail please, you will need it to log in!</span>-->
		</div>
		<div>
			Password
			<input id="pass1" name="pass1" type="pass1" />
			<span id="pass1Info">At least 5 characters</span>
		</div>
		<div>
			Confirm Password
			<input id="pass2" name="pass2" type="password" />
			<span id="pass2Info">Confirm password</span>
		</div>
		<!--<div>
			<label for="message">Message</label>
			<textarea id="message" name="message" cols="" rows=""></textarea>
		</div>-->
		<div>
			<input id="send"  type="submit" value="Send" />
		</div>
	</form>
</div>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="validation.js"></script>
</body>
</html>
<?php

$host="localhost"; // Host name 
$username=""; // Mysql username 
$password=""; // Mysql password 
$db_name="test"; // Database name 
$tbl_name="emails"; // Table name

// Connect to server and select database.
mysql_connect("$host", "$username", "$password")or die("cannot connect"); 
mysql_select_db("$db_name")or die("cannot select DB");

// Get values from form 
$name=$_POST['name'];
$email=$_POST['email'];
$pass1=$_POST['password'];

// Insert data into mysql 
$sql="INSERT INTO $tbl_name(name, email, password)VALUES('$name', '$email', 'password')";
$result=mysql_query($sql);

// if successfully insert data into database, displays message "Successful". 
if($result){
echo "Successful";
echo "<BR>";
echo "<a href='insert.php'>Back to main page</a>";
}

else {
echo "ERROR";
}
}
// close connection 
mysql_close();
?>

and this is the validation

<?php
function validateName($name){
	//if it's NOT valid
	if(strlen($name) < 4)
		return false;
	//if it's valid
	else
		return true;
}
function validateEmail($email){
	return ereg("^[a-zA-Z0-9]+[a-zA-Z0-9_-]+@[a-zA-Z0-9]+[a-zA-Z0-9.-]+[a-zA-Z0-9]+.[a-z]{2,4}$", $email);
}
function validatePasswords($pass1, $pass2) {
	//if DOESN'T MATCH
	if(strpos($pass1, ' ') !== false)
		return false;
	//if are valid
	return $pass1 == $pass2 && strlen($pass1) > 5;
}
function validateMessage($message){
	//if it's NOT valid
	if(strlen($message) < 10)
		return false;
	//if it's valid
	else
		return true;
}
?>

cpd · March 18, 2012

If your getting undefined in your javascript it suggests you haven't set your id attributes within your input tags correctly. Without all the code I doubt we'll be able to draw a thorough conclusion.

witchy478 · March 18, 2012

This is my validation.js

$(document).ready(function(){
//global vars
var form = $("#customForm");
var name = $("#name");
var nameInfo = $("#nameInfo");
var email = $("#email");
var emailInfo = $("#emailInfo");
var pass1 = $("#pass1");
var pass1Info = $("#pass1Info");
var pass2 = $("#pass2");
var pass2Info = $("#pass2Info");


//On blur
name.blur(validateName);
email.blur(validateEmail);
pass1.blur(validatePass1);
pass2.blur(validatePass2);
//On key press
name.keyup(validateName);
pass1.keyup(validatePass1);
pass2.keyup(validatePass2);

//On Submitting
form.submit(function(){
	if(validateName() & validateEmail() & validatePass1() & validatePass2())
		return true
	else
		return false;
});

//validation functions
function validateEmail(){
	//testing regular expression
	var a = $("#email").val();
	var filter = /^[a-zA-Z0-9]+[a-zA-Z0-9_.-]+[a-zA-Z0-9_-]+@[a-zA-Z0-9]+[a-zA-Z0-9.-]+[a-zA-Z0-9]+.[a-z]{2,4}$/;
	//if it's valid email
	if(filter.test(a)){
		email.removeClass("error");
		emailInfo.text("Valid E-mail please, you will need it to log in!");
		emailInfo.removeClass("error");
		return true;
	}
	//if it's NOT valid
	else{
		email.addClass("error");
		emailInfo.text("Stop cowboy! Type a valid e-mail please ");
		emailInfo.addClass("error");
		return false;
	}
}
function validateName(){
	//if it's NOT valid
	if(name.val().length < 4){
		name.addClass("error");
		nameInfo.text("We want names with more than 3 letters!");
		nameInfo.addClass("error");
		return false;
	}
	//if it's valid
	else{
		name.removeClass("error");
		nameInfo.text("What's your name?");
		nameInfo.removeClass("error");
		return true;
	}
}
function validatePass1(){
	var a = $("#password1");
	var b = $("#password2");

	//it's NOT valid
	if(pass1.val().length <5){
		pass1.addClass("error");
		pass1Info.text("Ey! Remember: At least 5 characters: letters, numbers and '_'");
		pass1Info.addClass("error");
		return false;
	}
	//it's valid
	else{			
		pass1.removeClass("error");
		pass1Info.text("At least 5 characters: letters, numbers and '_'");
		pass1Info.removeClass("error");
		validatePass2();
		return true;
	}
}
function validatePass2(){
	var a = $("#password1");
	var b = $("#password2");
	//are NOT valid
	if( pass1.val() != pass2.val() ){
		pass2.addClass("error");
		pass2Info.text("Passwords doesn't match!");
		pass2Info.addClass("error");
		return false;
	}
	//are valid
	else{
		pass2.removeClass("error");
		pass2Info.text("Confirm password");
		pass2Info.removeClass("error");
		return true;
	}
}
}
});

Sign In

Validation/insert problem

Recommended Posts

witchy478

Link to comment

Share on other sites

trq

Link to comment

Share on other sites

trq

Link to comment

Share on other sites

witchy478

Link to comment

Share on other sites

trq

Link to comment

Share on other sites

witchy478

Link to comment

Share on other sites

witchy478

Link to comment

Share on other sites

cpd

Link to comment

Share on other sites

witchy478

Link to comment

Share on other sites

Join the conversation

Browse

Activity

Important Information