Axios POST request Array with keys

Question

I have selected IDs data property

selected:[1,2,3]

I am try to send it in axios Post request like this

this is what I tried

return $axios.post(`/customer/pull`,{
      params: {
        customer_procedure_ids:this.selected
      }})

but the request is empty. in the console

Answer 1

I used FormData API to add the post data for the request.

Following is an example of how to do so:

let formData = new FormData();
formData.append("customer_procedure_ids", 1);
formData.append("customer_procedure_ids", 2);

Then simply add this to your data parameter in AXIOS.

await axios({
 data: formData,
})...;

This will append the data you want to post to the server.

Reference: https://developer.mozilla.org/en-US/docs/Web/API/FormData/FormData

PS: The data you are currently sending goes as JSON. To send it as a Post request you will need FromData API.

Answer 2

This is what I was looking for First, create FormData then loop through the array and assign an index to the key and add the value as the second arg

const formData = new FormData();
Array.from(this.selected).forEach((element, index) =>
  formData.append(`customer_procedure_ids[${index}]`, element)
);