PHP Tutorial - PHP Form Multi-Value Fields






Form fields can send multiple values, rather than a single value.

Example 1

For example, the following form fields are capable of sending multiple values to the server:

<label for="mySelection">What are your favorite widgets?</label> 
<select name="mySelection" id="mySelection" size="3" multiple="multiple"> 
  <option value="PHP">PHP Language</option> 
  <option value="Java">Java Language</option> 
  <option value="CSS">CSS Language</option> 
</select> 

A multi-select list box, allowing the user to pick one or more (or no) options.





Example 2

<label for="tested">Have you tested?</label>
<input type="checkbox" name="myTask" id="tested" value="testTask"/>

<label for="designed">Have you designed?</label>
<input type="checkbox" name="myTask" id="designed" value="designTask"/>

The checkboxes can have the same name (myTask) but different values (testTask and designTask).

If the user checks both checkboxes then both values, testTask and designTask, are sent to the server under the myTask field name.





How

So how can you handle multi-value fields in your PHP scripts? The trick is to add square brackets ( [] ) after the field name in your HTML form.

When PHP engine sees a submitted form field name with square brackets at the end, it creates a nested array of values within the $_GET or $_POST and $_REQUEST superglobal array, rather than a single value.

You can then pull the individual values out of that nested array. So you might create a multi-select list control as follows:

<select name="mySelection[]" id="mySelection" 
    size="3" multiple="multiple"> ... </select>

You'd then retrieve the array containing the submitted field values as follows:

$favoriteLanguage = $_GET["mySelection"];  // If using get method 
$favoriteLanguage = $_POST["mySelection"]; // If using post method 

Example 3

A Registration Form with Multi-Value Fields

<!DOCTYPE html5>
<html>
  <body>
    <form action="index.php" method="post"> 
        <label for="firstName">First name</label> 
        <input type="text" name="firstName" id="firstName" value="" /> 

        <label for="mySelection">What are your favorite widgets?</label> 
        <select name="mySelection[]" id="mySelection" size="3" multiple="multiple"> 
          <option value="PHP">PHP Language</option> 
          <option value="Java">Java Language</option> 
          <option value="CSS">CSS Language</option> 
        </select> 

        <label for="tested">Choice One?</label> 
        <input type="checkbox" name="chioces[]" id="ChoiceOne" value="testTask" /> 

        <label for="designed">Choice Two?</label> 
        <input type="checkbox" name="chioces[]" id="ChoiceTwo" value="designTask" /> 

        <input type="submit" name="submitButton" id="submitButton" value="Send Details" /> 
        <input type="reset" name="resetButton" id="resetButton"  value="Reset Form"/> 
      </div> 
    </form> 

  </body> 
</html> 

Now save the following script as index.php in your document root folder:

<!DOCTYPE html5> 
<html> 
<body> 
<?php 
$mySelection = ""; 
$chiocess = ""; 
if ( isset( $_POST["mySelection"] ) ) { 
  foreach ( $_POST["mySelection"] as $widget ) { 
    $mySelection .= $widget . ", "; 
  } 
} 

if ( isset( $_POST["chioces"] ) ) { 
  foreach ( $_POST["chioces"] as $chioces ) { 
    $chiocess .= $chioces . ", "; 
  } 
} 
$mySelection = preg_replace( "/, $/", "", $mySelection ); 
$chiocess = preg_replace( "/, $/", "", $chiocess ); 
?><dl> 
    <dt>First name</dt><dd><?php echo $_POST["firstName"]?></dd> 
    <dt>Favorite widgets</dt><dd><?php echo $mySelection?></dd> 
    <dt>You want to receive the following chiocess:</dt><dd> 
    <?php echo $chiocess?></dd> 
    <dt>Comments</dt><dd><?php echo $_POST["comments"]?></dd> 
</dl> 

</body> 
</html>