At the suggestion of a reader (thanks Justin), I decided to go ahead and turn the general formula for this into a short helper function to generate a random number.

Random Numbers: General Formula

First, let’s take a minute and recap the general formula for finding a random number.

Javascript’s Math.random() method returns a random number between 0 and 1. By multiplying this decimal value by a whole number, we can generate a desired range of values. For example, by multiplying Math.random()’s result by 10, we get a range of 0 to 10.

Next, we take the Math.floor value of that random number. This gives us just the integer portion – and it effectively cuts our range to 0 through 9. Finally, we can modify this by adding an offset number. So if we wanted a random number between 51 and 60, we’d add 51 to that result.

Creating a Random Number Function

The basic formula we end up with is…

(Math.floor( Math.rand() * setSize)) + setOffset;

Our code would be much more readable if we had a helper function that could be called like this…

randomNumber = rand(min, max);

Our function is going to take two parameters – min and max. From these two parameters, we can calculate the offset and the set size and generate the proper random number.

function rand(min, max) {
  var offset = min;
  var range = (max - min) + 1;
 
  var randomNumber = Math.floor( Math.random() * range) + offset;
  return randomNumber;
}

All done.

Add that function to a utility file, and you’ve got a handy random number generator at your disposal. It even uses the same format as PHP’s rand() function, to help increase consistency and readability in your code.

Some systems generate these initially and have the user log in to set a permanent password. You might also have a “Reset” button, where the script generates a random password and e-mails it to the user.

This quick tutorial will show you how to create an 8 character random password containing a mix of letters and numbers. Or, if you’re impatient, jump straight to the function’s source code

There are plenty of ways to do this. The simplest method would be to take a random number, generate an md5 hash, and then use the first 8 characters as the password.

$password = md5( time() );
$password = substr($password, 0, 8);

But this doesn’t guarantee you an even mix of upper case letters, lower case letters, and numbers. To do that, we’ll need to use a few simple php functions and build a short script.

Build a Loop to Create Eight Characters

We’ll start our script by creating a blank string, looping eight times, and entering a character in the string each time.

$password = '';
for ($x = 0; $x < 8; $x++) {
   $password .= 'a';
}

This creates a blank string ($password) and iterates a loop eight times. At this point, the loop simply enters the letter ‘a’ into $password – so you end output should be ‘aaaaaaaa.’

Generate Random Characters

Now we need to generate random characters to go inside of the string. To do this, we can make use of the rand() and chr() functions. Replace the loop contents with this line.

$password = chr( rand(60, 95) );

chr() takes an integer and returns the ASCII equivalent of that number. In this case, we’re using rand() to get a number between 60 and 95 – so we should get an uppercase letter in return. Our random password should now contain eight random upper-case letters.

Randomly Enter Uppercase, Lowercase, and Numbers

To make the random password more secure, we should randomize whether the new character is a number, an upper-case letter, or a lower-case letter. We can execute a simple “switch” statement to randomly choose which type of character to enter.

Replace the loop contents with this new snippet.

switch ( rand(1, 3) ) {
 
   //  Add a random digit, 0-9
   case 1:
   $password .= rand(0, 9);
   break;
 
   //  Add a random upper-case letter
   case 2:
   $password .= chr( rand(65, 90) );
   break;
 
   //  Add a random lower-case letter
   case 3:
   $password  .= chr( rand(97, 122) );
   break;
}

We’re using rand(1, 3) to randomly choose which case to execute. Each case then enters a different type of character in the string. The first case simply returns a random digit. The second and third cases use chr() and rand() to return a random character.

At this point, the script should give you an eight-character password with a random mix of uppercase letters, lowercase letters, and numbers. Now you can e-mail the password to the user, take a hash of the password, and store it in the database.

For reference, here’s the entire script placed in a function.

function randPassword() {
   $password = '';
 
   for ($x = 1; $x <= 8; $x++) {
      switch ( rand(1, 3) ) {
 
      //  Add a random digit, 0-9
      case 1:
      $password .= rand(0, 9);
      break;
 
      //  Add a random upper-case letter
      case 2:
      $password .= chr( rand(65, 90) );
      break;
 
      //  Add a random lower-case letter
      case 3:
      $password  .= chr( rand(97, 122) );
      break;
      }
   }
 
   return $password;
}

In order to do that, you need to figure out some way of storing or passing along the information from the first pages. I’ve heard a bunch of crazy ideas – from storing the information in session variables to writing each part to the database.

The easiest thing to do is attach a very brief php function to the bottom of each page. It’ll do all the work for you and continue to post every item the user has entered.

To start with, let’s create a hypothetical page one of a form. This will give us something to work with for the rest of this tutorial.

<form action="script.php" method="post">
  <input type="text" name="firstname" />
  <input type="text" name="lastname" />
  <input type="submit" name="poneSubmit" value="Continue" />
</form>

Here we’ve got three form elements – although only two of them really count. When we get to the second page, we need to make sure that “firstname” and “lastname” are passed along so that the final processing page can store the data appropriately.

When the second page (“script.php”) loads, these values will be stored in $_POST['firstname'] and $_POST['secondname'].

Every value in a form that is submitted with method="post" ends up in the superglobal array $_POST with a key equal to its name attribute in the form.

In order to continue to pass these values along and make them accessible through the $_POST superglobal on other pages, we can use a simple foreach loop. With each iteration of the loop, we’ll create a new <input type="hidden" /> to store the information.

foreach ($_POST as $key => $val) {
  echo '<input type="hidden" name="' . $key . 
    '" value="' . $val . '" />' . "\r\n";
}

This will cycle through the $_POST array and create all of the hidden elements for us. So we’d end up with this being added to our next page in the form.

<input type='hidden' name='firstname' value='Bob' />
<input type='hidden' name='lastname' value='Stevenson' />
<input type='hidden' name='poneSubmit' value='Continue' />

All you need to do is add that snippet of php to the end of your form on each subsequent(after page one), and all of the values will end up in the $_POST array at the end. [Note: Make sure this is inside the form tags, or else it won't get passed along.]

If you want to take it one step further, you can standardize this into a neat little function. Then include this function in your common includes file, and you can use it on any page with a simple function call.

function passArray($array) {
  foreach ($_POST as $key => $val) {
    echo '<input type="hidden" name="' . $key . 
      '" value="' . $val . '" />' . "\r\n";
  }
}

That’s all there is to it! Go write up some forms.

[Note: If you're wondering why the "\r\n" is there, it's just to make the source code look nicer. It adds a newline so that your source code is nice and spread out. Otherwise, every element our function adds would be on the same line - making the source code pretty illegible.]

Update. It’s been pointed out to me that there’s a possible security hole in this method. No big deal. This article that revisits multi-page forms patches the hole up nice and snug. I’d suggest you take a look at it.