[SOLVED] Upload image with FormData not working v2.0.6

Questions
1

Hi

The following code works fine on V1 but not on V2.0.6.

Why is FormData always empty?

Thanks

HTML

form id=“imageForm” method=“POST” action=“javascript:void(0)” enctype=“multipart/form-data” onsubmit=“uploadimage(this)”>
input capture onchange="$(’#imageForm’).trigger(‘submit’)"
name="imageData"
id="imageData"
accept="image/gif, image/jpeg, image/jpg, image/png"
multiple
type=“file” style=“display: none;”>
/form>

JS

ajaxReturn = myApp.request({
url: hostPages + “/XYZ/uploadimage”,
method: “POST”,
data: formData,
mimeType: “multipart/form-data”,
contentType: false,
cache: false,
dataType: ‘application/json’,
processData: false,
error: function (data) {
printNotification({ message: ‘General error. Please try again later.’ })
},
success: function (data) {
…
}

2

Why you set contentType:false? It must be multipart/form-data and there is no mimeType parameter

3

I was just following some examples and it was working before.

When I remove the contentType: false I get this error on express:

PayloadTooLargeError: request entity too large

4

Try also to set processData: true, if this errors still occurs then it is more likely server side problem

5

That made the trick!

Just for further reference:

ajaxReturn = myApp.request({
url: hostPages,
method: “POST”,
data: formData,
cache: false,
dataType: ‘application/json’,
mimeType: ‘multipart/form-data’,
processData: true,

Thanks!

1 Like
7

Can i full the full code for this please. Am stuck on submitting both image/file and form data

8

Can You please put all the code. I am also in the same situation with the images

9

This is the code I have:

    app.request({
          url: 'http://domain.com/wordpress/wp-json/test_post/v1/post_media',
          method: "POST",
          data: formData,
          cache: false,
          dataType: "application/json",
          mimeType: "multipart/form-data",
          processData: true,
          beforeSend: function ( xhr ) {
            console.log( "BEFORE SEND" );
            app.dialog.alert(JSON.stringify(xhr), "BEFORE SEND");
            xhr.setRequestHeader( 'Authorization', 'Basic '+username+':'+password );
          },
          success: function( data ) {
            app.dialog.alert(JSON.stringify(data), "SUCCESS");
            console.log( "SUCCESS" );
            console.log( data );
          },
          error: function( error ) {
            console.log( "ERROR" );
            app.dialog.alert(JSON.stringify(error), "ERROR");
            console.log( error );
          }
    });

It alerts everything (BEFORE SEND and SUCCESS) but the content on SUCESS is {}

What am I missing…