我可以在javascript中追加一個數組到'formdata'嗎？

我正在使用FormData上傳文件。我也想發送其他數據的數組。我可以在javascript中追加一個數組到'formdata'嗎？

當我發送圖像時，它工作正常。當我將一些文本附加到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(); 
      } 
     });

來源

2012-12-24 Don P

爲什麼要添加屬性到一個數組？改爲使用對象。 – Musa

我懷疑PHP的背景。在Javascript中，數組並不像這樣工作。 – kapa

就是這樣:)我將使用一個對象。 –

這個怎麼樣？

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

...並且相應地在服務器上使用json_decode來對其進行解碼。見，FormData.append的第二個值可以...

的Blob，文件，或者一個字符串，如果沒有，則該值轉換爲字符串

我看到的樣子它，你的tags數組包含對象（@Musa是正確的，順便說一句;使this_tag一個數組，然後分配字符串屬性，它沒有任何意義;使用普通對象），所以本地轉換（toString()）是不夠的。不過，JSON'ing應該可以獲得信息。

一點題外話，我的財產分配塊改寫剛剛進入這個：

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

來源

2012-12-24 23:47:32 raina77ow

這很好，謝謝！讓我試試 –

唯一的問題是JSON.stringify（）給我帶有轉義引號的輸出。這使得它無法在PHP端進行解釋。你知道如何destringify？ –

這裏是輸出[{\「article \」：\「Article \」，\「gender \」：\「Gender \」，\「brand \」：\「Brand \」}] –

使用"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); 
...

來源

2014-08-19 15:41:05 halfbit

輝煌！我的需求與OP相似，但我想用一組文件輸入填充FormData對象。我試圖用AJAX上傳任意數量的文件，用戶使用標準表單輸入元素指定。服務器端實現要求所有文件都嵌套在一個密鑰下，這是我實現這一目標的唯一方法。在https://developer.mozilla.org/en-US/docs/Web/API/FormData/append中完全沒有提到這種數組符號技術。我半分謝謝你，夠了！ –

我在上面引用的文檔中添加了一個示例來演示這種特定用法。處理多文件上傳時，包含方括號的功能非常有用，因爲結果數據結構更有利於循環。再次感謝！ –

寫作之內

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

你可以像普通數組一樣接收post/get by php。

來源

2016-01-23 03:46:38 Yosuke

如何在服務器端收集這些數據 –

功能：

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' 
    ] 
});

來源

2017-09-26 13:21:21 Doglas

我可以在javascript中追加一個數組到'formdata'嗎？

回答

相關問題