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
– naiquevin, Commented Jan 14, 2011 at 7:41
The link is broken: “Not Found. The requested URL / was not found on this server.” — Peter Mortensen
– Peter Mortensen, Commented Sep 28, 2021 at 14:35

aksu · Accepted Answer · 2014-02-22 14:11:13Z

65

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>

edited Feb 22, 2014 at 14:11

aksu

5,2365 gold badges26 silver badges39 bronze badges

answered Jan 14, 2011 at 8:29

Fenton

253k74 gold badges404 silver badges414 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

The Odd Developer Over a year ago

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.

mickmackusa Over a year ago

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.

Peter Mortensen · Accepted Answer · 2021-09-28 14:38:47Z

18

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.

edited Sep 28, 2021 at 14:38

Peter Mortensen

31.4k22 gold badges110 silver badges134 bronze badges

answered Mar 23, 2017 at 7:40

Galley

6338 silver badges9 bronze badges

Comments

Peter Mortensen · Accepted Answer · 2021-09-28 14:37:22Z

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, 2021 at 14:37

Peter Mortensen

31.4k22 gold badges110 silver badges134 bronze badges

answered Jan 14, 2011 at 7:39

sissonb

3,7904 gold badges31 silver badges56 bronze badges

Collectives™ on Stack Overflow

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

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related