post data array with formData axios

Question

i will send array data using formData. the backend accepts the data array with a dash; example if in postman using form-data like this:

id_barang : 122;288;383 (send 3 value id with dash ;)

if i use formData is it like this?

  data [
       {
          id_barang : 122
       },
       {
          id_barang : 288
       },
       {
          id_barang : 383
       }
    ]
    
     let barang = data.map(x => x.id_barang).join(";");
     const f = new FormData();
     f.append("id_barang", barang);


     //please correct me if i'm wrong

Answer 1

You can stringify your array and append it in the FormData and in the backend, you can parse that data and use it accordingly. Check out the example below.

 let formData = new FormData(); let data = [ { id_barang: 122 }, { id_barang: 288 }, { id_barang: 383 } ] formData.append("arr", JSON.stringify(data)); for (var value of formData.values()) { console.log(value); }

Answer 2

There is nothing wrong with your code. the only thing missing here is that you didn't provide a way of sending your request with axios. when you use FormData with axios you need to add 'Content-Type': 'multipart/form-data' . however if you don't add any files to Formdata then there is no need to use Formdata

Here is the compete action:

var banyakBarang = [
    { id_barang: 122 },
    { id_barang: 288 },
    { id_barang: 383 }
];

var barangString = banyakBarang.map(function(barang) {
    return barang.id_barang;
}).join(';');

var formData = new FormData();
formData.append('id_barang', barangString);

axios({
    method: 'post',
    url: '/x',
    data: formData,
    headers: {
        'Content-Type': 'multipart/form-data'
    },
});

Request Payload:

id_barang: 122;288;383

Answer 3

Axios has paramsSerializer option, you can set it to comma-separated arrayFormat with qs.stringify.

const paramsSerializer = (params: any) => stringify(params, { arrayFormat: 'comma' });