How do I get values of input element with the same name as an javascript array?

Question

I want to get values of the input element that those elements are under the same name, name="items[]"
for example:

<div>...<input type="text" name="items[]" value="1" /></div>
<div>...<input type="text" name="items[]" value="2" /></div>
<div>...<input type="text" name="items[]" value="3" /></div>

And I wish to get the result something like:

[1, 2, 3] //that store in an javascript variable.

Do I need to do a loop to access all the elements to get its value? Please give me a good solution either javascript or JQuery.
Thanks

If you click on your profile, Alwayz, you can clearly see in RED letters : 'Have you considered to accept one answer?' You think it's here by mistake? — Roko C. Buljan, Aug 23 '11 at 07:44
ok, I understand, but i just post a question. I'll wait to see which answer that useful for me and i'll vote them up — Alwayz Change, Aug 23 '11 at 07:49

score 38 · Accepted Answer · answered Aug 23 '11 at 07:37

38

var values = [];
$("input[name='items[]']").each(function() {
    values.push($(this).val());
});

answered Aug 23 '11 at 07:37

Igor Dymov

16,230
5
50
56

hi Igor, i'm sorry for unclear question, all the elements are in the div elements as i corrected above. – Alwayz Change Aug 23 '11 at 07:43
this selector will select input elements even if they are inside the div; you may use `$("div input[name='items[]']")` if you want to be sure – Igor Dymov Aug 23 '11 at 07:45
but it alerts nothing. I used to try $('classname').each(function() { values += $(this).val() }); but it also show nothing – Alwayz Change Aug 23 '11 at 07:48
ok, thanks Igor, it works, I have a problem with my code, that y it doesn't work, thank you much ^^ – Alwayz Change Aug 23 '11 at 08:03

score 8 · Answer 2 · edited May 23 '17 at 12:25

8

JavaScript only:

var values = [];
var fields = document.getElementsByName("items[]");
for(var i = 0; i < fields.length; i++) {
    values.push(fields[i].value);
}

Warning, see: getElementsByName in IE7

edited May 23 '17 at 12:25

Community

1
1

answered Aug 23 '11 at 07:53

Graham

14,885
4
36
42

i think there would be problems with `getElementsByName` in IE – Igor Dymov Aug 23 '11 at 07:55
@igor agreed jQuery is the way to go, but the OP asked for both – Graham Aug 23 '11 at 08:13

score 4 · Answer 3 · answered Aug 23 '11 at 07:56

4

Or use jQuery's map function:

$("div input[name='items[]']").map( function() { return $(this).val(); } ).get();

answered Aug 23 '11 at 07:56

Jochem

2,995
16
18

2

Be careful with .map(), in some browsers it returns an array but in others it returns an object `m.fn.init[]` (Chrome). This latter one cannot be stringified by JSON.stringify(). Specifically, the following two are NOT equivalent: `var arr=$('input[name="foo"]').map(function(){return this.value}).get()` with `var arr=[]; $('input[name="foo"]').each(function(){arr.push(this.value)})`. In the first case `arr` is not an Array whereas in the latter case it is. `JSON.stringify(arr)` fails for the former, but works for the latter. – Normadize Apr 08 '15 at 16:13

How do I get values of input element with the same name as an javascript array?

3 Answers3

Linked

Related