Jump to content

Need information to stay in fields after page refresh..


pappakaka

Recommended Posts

When someone types in thier information in my Sign Up form i want the information they entered to stay after the page refresh.

 

For example: I type in my information, but in the email field i forget the '@' symbol and then hit "Sign Up". Then the page would refresh and i would get an error message saying "You must enter a valid email address!" and all the information i typed in before would be gone and i'd have to start over with everything..

 

My question is, how can i make so that all the information I entered stays after the page refresh? Is there a simple way to do it or do I have to rewrite all my code? (i've provided it below)

 

I know that you can use jQuery, AJAX and JS to acomplish this and also show the error message without refreshing the page but I don't know much about that and i'm trying to use as little JS as I can. So if there is another easier way?

 

Here is my PHP script that holds the validation process and shows the errors etc:

<?php

class Register
{
  private $username;
  private $first_name;
  private $last_name;
  private $password;
  private $passmd5;
  private $email;
  private $confemail;
  private $gender;
  private $birth_month;
  private $birth_day;
  private $birth_year;
  private $iagree;

  private $errors;
  private $token;

  public function __construct()
  {
    $this->errors = array();

    $this->username     = $this->filter($_POST['username']);
$this->first_name   = $this->filter($_POST['first_name']);
$this->last_name    = $this->filter($_POST['last_name']);
    $this->password     = $this->filter($_POST['password']);
    $this->email        = $this->filter($_POST['email']);
$this->confemail    = $this->filter($_POST['confemail']);
$this->gender       = $this->filter($_POST['gender']);
$this->birth_month  = $this->filter($_POST['birth_month']);
$this->birth_day    = $this->filter($_POST['birth_day']);
$this->birth_year   = $this->filter($_POST['birth_year']);
$this->iagree       = $this->filter($_POST['iagree']);
    $this->token        = $_POST['token'];

    $this->passmd5      = md5($this->password);
  }

  public function process()
  {
    if($this->valid_token() && $this->valid_data())
         $this->register();

    return count($this->errors)? 0 : 1;
  }

  public function filter($var)
  {
    return preg_replace('/[^a-zA-Z0-9@.]/','',$var);
  }

  public function register()
  {
   mysql_connect("localhost","root","") or die(mysql_error());
   mysql_select_db("membership") or die (mysql_error());

   $sql = "INSERT INTO users(username,password,first_name,last_name,email,gender,birth_month,birth_day,birth_year) VALUES ('{$this->username}','{$this->passmd5}','{$this->first_name}','{$this->last_name}','{$this->email}','{$this->gender}','{$this->birth_month}','{$this->birth_day}','{$this->birth_year}')";
mysql_query($sql) or die(mysql_error());

   if(mysql_affected_rows()< 1)
     $this->errors[] = "Could Not Process Form";
  }

  public function user_exists()
  {
    mysql_connect("localhost","root","") or die(mysql_error());
    mysql_select_db("membership") or die (mysql_error());

    $data = mysql_query("SELECT username FROM users WHERE username = '{$this->username}'");

    return mysql_num_rows($data) > 0 ? 1 : 0;
  }

  public function show_errors()
  {

    foreach($this->errors as $key=>$value)
      echo "<div class=errormessages> 
				$value
		</div>
		<br />";
  }

  public function valid_data()
  {
    if ($this->user_exists()){
      $this->errors[] = 'The username is already taken, choose another one!';
      }
if (empty($this->username)){
      $this->errors[] = 'You must enter a username!';
  }
if (empty($this->first_name)){
      $this->errors[] = 'You must enter your first name';
  }
  
    if (empty($this->password)){
      $this->errors[] = 'You must enter a password!';
  }
elseif (strlen($this->password) < 6){
  $this->errors[] = 'Your password must be longer than 6 characters!';
  }

    if (empty($this->email)){
      $this->errors[] = 'You must enter an email address!';
  }
elseif (!preg_match('/^[a-zA-Z0-9._-]+@[a-zA-Z0-9._-]+\.[a-zA-Z]{2,4}$/',$this->email)){
  $this->errors[] = 'You must enter a valid email address!';
  }
elseif ($this->email != $this->confemail){
  $this->errors[] = 'The email addresses you entered did not match!';
  }

if (empty($this->birth_month)){
      $this->errors[] = 'Select which month you were born!';
  }
if (empty($this->birth_day)){
      $this->errors[] = 'Select which day you were born!';
  }
if (empty($this->birth_year)){
      $this->errors[] = 'Select which year you were born!';
  }
if (empty($this->iagree)){
  $this->errors[] = 'You must agree to the <a href="#">Privacy Policy</a> and <a href="#">Terms of Use</a> to sign up!';
  }

  return count($this->errors)? 0 : 1;
  }


  public function valid_token()
  {
   if(!isset($_SESSION['token']) || $this->token != $_SESSION['token'])
     $this->errors[] = "Invalid Submission";

   return count($this->errors)? 0 : 1;
  }
}

?>

 

And here the HTML form:

<?php
session_start();

if(isset($_POST['register']))
{
  include_once('classes/class.register.php');

  $register = new Register();

  if($register->process())
    echo "Successfully Signed Up!";
  else
    $register->show_errors();
}

$token = $_SESSION['token'] = md5(uniqid(mt_rand(),true));
?>



<!doctype html>
<html>
<head>

<link rel="stylesheet" type="text/css" href="css/main.css">
<link rel="stylesheet" type="text/css" href="css/register.css">
<script type="text/javascript" src="js/passwordmeter.js"></script>

</head>
<body>

<script src="jquery.js"></script>

<div class="center">

			<!-- PHP -->
	<?php require("html/menu.inc"); ?>
	<?php require("html/layout.inc"); ?>
	<?php require("html/login.inc"); ?>
			<!-- PHP -->

	<div class="register">
	<header>Sign Up Now!</header>
	<form method="POST" action="<?php echo $_SERVER['PHP_SELF'];?>">
		<ul>
			<li>
				<label for="username">* Username: </label><br />
				<input name="username" autofocus="on" class="rusernamefield" type="text"></input>
			</li>
			<li>
				<label for="first_name">* First Name: </label><br />
				<input name="first_name" class="rfirstnamefield" type="text"></input>
			</li>
			<li>
				<label for="last_name">Last Name: </label><br />
				<input name="last_name" class="rlastnamefield" type="text"></input>
			</li>
			<li>
				<label for="password">* Password: </label><br />
				<input name="password" class="rpasswordfield" onkeyup='password_strength(this.value)'></input>
			</li>

			<div id="password_strength_border">
				<div id="password_strength" class="strength0"></div>
			</div>

			<li>
				<label for="email">* Email Address: </label><br />
				<input name="email" class="remail" type="email" placeholder="email@address.com"></input>
			</li>
			<li>
				<label for="confemail">* Confirm Email Address: </label><br />
				<input name="confemail" class="rconfirmemail" type="email" placeholder="email@address.com"></input>
			</li>
			<li>
				<label for="gender">* Gender: </label><br />
				<select name="gender">
					<option value="Man" selected="selected">Man</option>
					<option value="Woman">Woman</option>
				</select>
			</li>
			<li>
				<label for="birth_month">* Birth Day: </label><br />
				<select name="birth_month">
					<option disabled="disabled" selected="selected">Month</option>
					<option value="01">January</option>
					<option value="02">February</option>
					<option value="03">March</option>
					<option value="04">April</option>
					<option value="05">May</option>
					<option value="06">June</option>
					<option value="07">July</option>
					<option value="08">August</option>
					<option value="09">September</option>
					<option value="10">October</option>
					<option value="11">November</option>
					<option value="12">December</option>
				</select>
				<select name="birth_day">
					<option disabled="disabled" selected="selected">Day</option>
					<option value="01">1</option>
					<option value="02">2</option>
					<option value="03">3</option>
					<option value="04">4</option>
					<option value="05">5</option>
					<option value="06">6</option>
					<option value="07">7</option>
					<option value="08">8</option>
					<option value="09">9</option>
					<option value="10">10</option>
					<option value="11">11</option>
					<option value="12">12</option>
					<option value="13">13</option>
					<option value="14">14</option>
					<option value="15">15</option>
					<option value="16">16</option>
					<option value="17">17</option>
					<option value="18">18</option>
					<option value="19">19</option>
					<option value="20">20</option>
					<option value="21">21</option>
					<option value="22">22</option>
					<option value="23">23</option>
					<option value="24">24</option>
					<option value="25">25</option>
					<option value="26">26</option>
					<option value="27">27</option>
					<option value="28">28</option>
					<option value="29">29</option>
					<option value="30">30</option>
					<option value="31">31</option>
				</select>
				<select name="birth_year">
					<option disabled="disabled" selected="selected">Year</option>
					<option value="2011">2011</option>
					<option value="2010">2010</option>
					<option value="2009">2009</option>
					<option value="2008">2008</option>
					<option value="2007">2007</option>
					<option value="2006">2006</option>
					<option value="2005">2005</option>
					<option value="2004">2004</option>
					<option value="2003">2003</option>
					<option value="2002">2002</option>
					<option value="2001">2001</option>
					<option value="2000">2000</option>
					<option value="1999">1999</option>
					<option value="1998">1998</option>
					<option value="1997">1997</option>
					<option value="1996">1996</option>
					<option value="1995">1995</option>
					<option value="1994">1994</option>
					<option value="1993">1993</option>
					<option value="1992">1992</option>
					<option value="1991">1991</option>
					<option value="1990">1990</option>
					<option value="1989">1989</option>
					<option value="1988">1988</option>
					<option value="1987">1987</option>
					<option value="1986">1986</option>
					<option value="1985">1985</option>
					<option value="1984">1984</option>
					<option value="1983">1983</option>
					<option value="1982">1982</option>
					<option value="1981">1981</option>
					<option value="1980">1980</option>
					<option value="1979">1979</option>
					<option value="1978">1978</option>
					<option value="1977">1977</option>
					<option value="1976">1976</option>
					<option value="1975">1975</option>
					<option value="1974">1974</option>
					<option value="1973">1973</option>
					<option value="1972">1972</option>
					<option value="1971">1971</option>
					<option value="1970">1970</option>
					<option value="1969">1969</option>
					<option value="1968">1968</option>
					<option value="1967">1967</option>
					<option value="1966">1966</option>
					<option value="1965">1965</option>
					<option value="1964">1964</option>
					<option value="1963">1963</option>
					<option value="1962">1962</option>
					<option value="1961">1961</option>
					<option value="1960">1960</option>
					<option value="1959">1959</option>
					<option value="1958">1958</option>
					<option value="1957">1957</option>
					<option value="1956">1956</option>
					<option value="1955">1955</option>
					<option value="1954">1954</option>
					<option value="1953">1953</option>
					<option value="1952">1952</option>
					<option value="1951">1951</option>
					<option value="1950">1950</option>
					<option value="1949">1949</option>
					<option value="1948">1948</option>
					<option value="1947">1947</option>
					<option value="1946">1946</option>
					<option value="1945">1945</option>
					<option value="1944">1944</option>
					<option value="1943">1943</option>
					<option value="1942">1942</option>
					<option value="1941">1941</option>
					<option value="1940">1940</option>
					<option value="1939">1939</option>
					<option value="1938">1938</option>
					<option value="1937">1937</option>
					<option value="1936">1936</option>
					<option value="1935">1935</option>
					<option value="1934">1934</option>
					<option value="1933">1933</option>
					<option value="1932">1932</option>
					<option value="1931">1931</option>
					<option value="1930">1930</option>
					<option value="1929">1929</option>
					<option value="1928">1928</option>
					<option value="1927">1927</option>
					<option value="1926">1926</option>
					<option value="1925">1925</option>
					<option value="1924">1924</option>
					<option value="1923">1923</option>
					<option value="1922">1922</option>
					<option value="1921">1921</option>
					<option value="1920">1920</option>
					<option value="1919">1919</option>
					<option value="1918">1918</option>
					<option value="1917">1917</option>
					<option value="1916">1916</option>
					<option value="1915">1915</option>
					<option value="1914">1914</option>
					<option value="1913">1913</option>
					<option value="1912">1912</option>
					<option value="1911">1911</option>
					<option value="1910">1910</option>
					<option value="1909">1909</option>
					<option value="1908">1908</option>
					<option value="1907">1907</option>
					<option value="1906">1906</option>
					<option value="1905">1905</option>
					<option value="1904">1904</option>
					<option value="1903">1903</option>
					<option value="1902">1902</option>
					<option value="1901">1901</option>
					<option value="1900">1900</option>
				</select>
			</li>
			<li>
				<label for="iagree" class="iagreetext">*  I Agree to the <a href="#">Privacy Policy</a> and <a href="#">Terms of Use</a></label>
				<input name="iagree" type="checkbox" class="iagreebox"></input>
			</li>
			<input name="register" class="registerbutton" type="submit" value="Sign Up"></input>
			<p class="fieldsmarked">Fields marked with an (*) is required</p>
			<input type="hidden" name="token" value="<?php echo $token;?>"/>
		</ul>
	</form>
	</div>

</div>

</body>
</html>

Link to comment
Share on other sites

using example of one of the fields, username, this is what i do:

 

<?php

// initialize all form vars to ''.
$username = '';

// Handle post, if any
if ($_SERVER['REQUEST_METHOD'] == "POST") {
     // update the values of all form variables
     $username = isset($_POST['username'])?$_POST['username']:'';

     // form submission code here, etc.
}

// Make values safe to display in HTML, after using stripslashes() IF NECESSARY
$username = htmlspecialchars($username, ENT_QUOTES);

// LATER, in the HTML form, set the value
<input type='text' name='username' value='<?php echo $username; ?>'>

 

 

Link to comment
Share on other sites

I don't know if this was how you ment but I meda a few tests and i can't get it to work?

 

I added this function in the end of the PHP file:

  public function test()
  {
   if ($_SERVER['REQUEST_METHOD'] == "POST") {
     $username = isset($_POST['username'])?$_POST['username']:'';
     }

   $username = htmlspecialchars($username, ENT_QUOTES);
   }

 

and this line in the HTML form:

<input name="username" autofocus="on" class="rusernamefield" type="text" value="<?php echo $username; ?>"></input>

:shrug:

 

Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.