Suppose we have a selection box with a list of colors, and we want the visitor to be able to choose several and not just one, we use multiple selection box.
Check out the source code below:
<!DOCTYPE html>
<html>
<head>
<title>Form preview</title>
<meta charset="UTF-8">
</head>
<body>
<form action="registraratos.php" method="post">
Select one or multiple colors (Press Ctrl to select multiple colors)<br>
<select name="colors[]" size="4" multiple>
<option value="1">Pink</option>
<option value="2">Green</option>
<option value="3">Blue</option>
<option value="4">Yellow</option>
<option value="5">White</option>
<option value="6">Black</option>
<option value="7">Orange</option>
<option value="8">Violet</option>
</select>
<br>
<input type="submit" value="Submit">
</form>
</body>
</html>
The result in the browser is:
We can observe the syntax for the definition of a multi-selection box:
<select name="colores[]" size="4" multiple>
We define a property called multiple and we do not assign a value to it.
On the other hand, we add the characters [] to the end of the name defined in the name attribute so that from the server we can identify that the control possibly returns many values.
It is also common to initialize the size property with a value greater than 1 to make selection easier.
Most browsers allow you to select options that are not found together by using the mouse and simultaneously pressing the Ctrl key.
