Можно ли добавить массив в 'formdata' в javascript?

Я использую FormData для загрузки файлов. Я также хочу отправить массив других данных.

Когда я отправляю только изображение, он отлично работает. Когда я добавляю некоторый текст в formdata, он отлично работает. Когда я пытаюсь прикрепить массив тегов ниже, все остальное работает нормально, но массив не отправляется.

Любые известные проблемы с FormData и добавляемыми массивами?

Создавать формуДата:

formdata = new FormData();

Массив, который я создаю. Console.log показывает, что все работает нормально.

        // Get the tags
        tags = new Array();
        $('.tag-form').each(function(i){
            article = $(this).find('input[name="article"]').val();
            gender = $(this).find('input[name="gender"]').val();
            brand = $(this).find('input[name="brand"]').val();
            this_tag = new Array();
            this_tag.article = article;
            this_tag.gender = gender;
            this_tag.brand = brand;
            tags.push(this_tag);    
            console.log('This is tags array: ');
            console.log(tags);
        });
        formdata.append('tags', tags);
        console.log('This is formdata: ');
        console.log(formdata);

Как я его отправляю:

        // Send to server
        $.ajax({
            url: "../../build/ajaxes/upload-photo.php",
            type: "POST",
            data: formdata,
            processData: false,
            contentType: false,
            success: function (response) {
                console.log(response);
                $.fancybox.close();
            }
        });

Ответы

Ответ 1

Как насчет этого?

formdata.append('tags', JSON.stringify(tags));

... и, соответственно, используя json_decode на сервере, чтобы отменить его. Смотрите, второе значение FormData.append может быть...

a Blob, File или строка, если они не указаны, значение преобразуется в строка

Как я его вижу, ваш массив tags содержит объекты (@Musa прав, btw; создание this_tag массива, тогда присвоение ему свойств строки не имеет смысла, вместо этого используйте простой объект), поэтому родное преобразование (с toString()) будет недостаточно. JSON'ing должен получить информацию через.

Как побочный элемент, я бы переписал блок присваивания свойств именно этому:

tags.push({article: article, gender: gender, brand: brand});

Ответ 2

Запись как

var formData = new FormData;
var array = ['1', '2'];
for (var i = 0; i < array.length; i++) {
    formData.append('array_php_side[]', array[i]);
}

вы можете получить так же, как обычный пост /get массива по php.

Ответ 3

используйте "xxx[]" как имя поля в formdata (в вашем случае вы получите массив строковых объектов)

поэтому в вашем цикле

$('.tag-form').each(function(i){
            article = $(this).find('input[name="article"]').val();
            gender = $(this).find('input[name="gender"]').val();
            brand = $(this).find('input[name="brand"]').val();
            this_tag = new Array();
            this_tag.article = article;
            this_tag.gender = gender;
            this_tag.brand = brand;
            //tags.push(this_tag);    
            formdata.append('tags[]', this_tag);
...

Ответ 4

Функции:

function appendArray(form_data, values, name){
    if(!values && name)
        form_data.append(name, '');
    else{
        if(typeof values == 'object'){
            for(key in values){
                if(typeof values[key] == 'object')
                    appendArray(form_data, values[key], name + '[' + key + ']');
                else
                    form_data.append(name + '[' + key + ']', values[key]);
            }
        }else
            form_data.append(name, values);
    }

    return form_data;
}

Использование:

var form = document.createElement('form');// or document.getElementById('my_form_id');
var formdata = new FormData(form);

appendArray(formdata, {
    'sefgusyg': {
        'sujyfgsujyfsg': 'srkisgfisfsgsrg'
    }, test1: 5, test2: 6, test3: 8, test4: 3, test5: [
        'sejyfgjy',
        'isdyfgusygf'
    ]
});

Ответ 5

var formData = new FormData;
var alphaArray = ['A', 'B', 'C','D','E'];
for (var i = 0; i < alphaArray.length; i++) {
    formData.append('listOfAlphabet', alphaArray [i]);
}

И по вашему запросу вы получите массив алфавитов.

Ответ 6

Вы можете только структурировать массив и добавить его. Посылает массив как фактический массив, даже если у него есть только один элемент.

const array = [ 1, 2 ];
let formData = new FormData();
formData.append("numbers", JSON.stringify(array));

Ответ 7

Это работает для меня, когда я отправил файл + текст + массив:

if (isArray(value)) {
  const k = '${key}[]';
  uploadData.append(k, value);
} else {
  uploadData.append(key, value);
}