Ok, so I have form for creating polls. I want to use AJAX request and able user to attach image instead of question, so I use FormData for this.

I could't find any solution for working with multiple input with same name (named like this: "name[]"). I tried this option:

var fdata = new FormData();
fdata.append('answers[]', $('input[name="answer[]"]').val());

But it doesn't work. I know I could use .each(), but I don't want different name for each question, so I don't have to rebuild PHP side too much.

Thanks for any help.

Ok, so I have form for creating polls. I want to use AJAX request and able user to attach image instead of question, so I use FormData for this.

I could't find any solution for working with multiple input with same name (named like this: "name[]"). I tried this option:

var fdata = new FormData();
fdata.append('answers[]', $('input[name="answer[]"]').val());

But it doesn't work. I know I could use .each(), but I don't want different name for each question, so I don't have to rebuild PHP side too much.

Thanks for any help.

• javascript
• jquery
• form-data

2 Answers 2

You have to append each value in turn. Currently you are only appending the first one (because that is what val() returns.

$('input[name="answer[]"]').each(function (index, member) {
    var value = $(member).val();
    fdata.append('answers[]', value);
});

The problem is $('input[name="answer[]"]').val() isn't giving you what you need; it returns the first input element's value. Instead, you want an array of values:

var values = [];
$('input[name="answer[]"]').each(function(i, item) {
    values.push(item.value);
});

fdata.append('answers[]', values);

http://jsfiddle/j5ezgxe9/