Search code examples
javascriptmultipartform-dataform-data

Append object which contain File and String value into FormData - JS

I'm finding a solution to append object which contain File and String value into FormData and send it to server (MultiPartParser of Django Rest FrameWork).

Console.log(file) enter image description here

Now my code is:

Fd.append('file_uploads', JSON.stringify({ 'file': file, 'order_num': 1 }) )

When I console.log this value of form data, it returns {"file":{},"order_num":1}. You can see file value is empty.

I tried to remove JSON.stringify:

Fd.append('file_uploads', { 'file': file, 'order_num': 1 } )

When I console.log this value of form data, it returns [object, object].

I want the results is

{"file":<file_object>,"order_num":1}

Solution

  • You can not append file object and key value with FormData. Try alternative solution like this

    i.e) I will add order_no with file name and in python you can use string split function to get the order_no

    Fd.append('file_uploads', file, 'your_filename_here_and_order_no');