HTML Element Array, name="something[]" or name="something"?

Question

I saw something on this site:

Handling array of HTML Form Elements in JavaScript and PHP http://www.ajaxprojects.com/ajax/tutorialdetails.php?itemid=343

It said to put the array in the name property and how to get the input collection's value. For example, name="education[]"

But as I know, an HTML input element is array-ready by name. On the client-side (GetElementsByName) or server-side ($_POST in PHP or Request.Form in ASP.NET).

For example: name="education", so what is the different with or without the []?

with education[], you can have input fields with names something like education[subject][1] and education[subject][2] as get the corresponding associative array on the server side (in php $_POST['education']) — naiquevin, Jan 14 '11 at 07:41
The link is broken: *“Not Found. The requested URL / was not found on this server.”* — Peter Mortensen, Sep 28 '21 at 14:35

score 63 · Accepted Answer · edited Feb 22 '14 at 14:11

PHP uses the square bracket syntax to convert form inputs into an array, so when you use name="education[]" you will get an array when you do this:

$educationValues = $_POST['education']; // Returns an array
print_r($educationValues); // Shows you all the values in the array

So for example:

<p><label>Please enter your most recent education<br>
    <input type="text" name="education[]">
</p>
<p><label>Please enter any previous education<br>
    <input type="text" name="education[]">
</p>
<p><label>Please enter any previous education<br>
    <input type="text" name="education[]">
</p>

Will give you all entered values inside of the $_POST['education'] array.

In JavaScript, it is more efficient to get the element by id...

document.getElementById("education1");

The id doesn't have to match the name:

<p><label>Please enter your most recent education<br>
   <input type="text" name="education[]" id="education1">
</p>

But in my code, when I access array values through jquery, it gets an additional empty input value as well. Assume if I have entered 2 values, but it comes with 3 values which is one value as an empty string. — CodeCanyon, Jun 05 '20 at 04:12
Make sure that if you are generating elements in a loop, that you are not generating duplicated `id` attributes in the same HTML document -- duplicate `id` values will cause an HTML document to be invalid. — mickmackusa, Jun 27 '22 at 00:42

score 18 · Answer 2 · edited Sep 28 '21 at 14:38

It's different.

If you post this form:

<input type="text" name="education[]" value="1">
<input type="text" name="education[]" value="2">
<input type="text" name="education[]" value="3">

you will get an array in PHP. In this example you will get $_POST['education'] = [1, 2, 3].

If you post this form without [],

<input type="text" name="education" value="1">
<input type="text" name="education" value="2">
<input type="text" name="education" value="3">

you will get the last value. Here you will get $_POST['education'] = 3.

score 17 · Answer 3 · edited Sep 28 '21 at 14:37

17

If you have checkboxes, you can pass an array of checked values.

<input type="checkbox" name="fruits[]" value="orange"/>
<input type="checkbox" name="fruits[]" value="apple"/>
<input type="checkbox" name="fruits[]" value="banana"/>

Also multiple select dropdowns

<select name="fruits[]" multiple>
    <option>apple</option>
    <option>orange</option>
    <option>pear</option>
</select>

edited Sep 28 '21 at 14:37

Peter Mortensen

30,738
21
105
131

answered Jan 14 '11 at 07:39

sissonb

3,730
4
27
54

HTML Element Array, name="something[]" or name="something"?

3 Answers3

Linked

Related