Warning: There is no border in POST data with multiple data / data forms in Unknown on line 0

Question

I am working on a file loader that loads an image when changing the input of my code for the form in html

<form method="post" enctype="multipart/form-data"> <input name="uploaded[]" type="file" id="file_upload"/> </form> 

My JavaScript and Ajax:

  document.getElementById("file_upload").onchange = function() { var id = document.getElementById("user_id").innerHTML; var file = document.getElementById("file_upload").files[0]; alert(file.size); var formdata = new FormData(); formdata.append("filer",file,true); var ajax = new XMLHttpRequest(); ajax.onreadystatechange = function(){ if(ajax.readyState==4 && ajax.status==200){ document.getElementById("one").remove(); var img = document.createElement('img'); var first_path = '/user_image/'; var path = first_path.concat(id,'.png'); img.setAttribute('alt','User image'); img.setAttribute('id','one'); img.setAttribute('src',path); document.getElementById("user").appendChild(img); alert("end"); } else{ document.getElementById("one").remove(); var img = document.createElement('img'); img.setAttribute('src','/img/loading.gif'); img.setAttribute('alt','User image'); img.setAttribute('id','one'); document.getElementById("user").appendChild(img); } } ajax.open("POST","upload_image.php"); ajax.setRequestHeader("Content-Type", "multipart/form-data"); ajax.send(formdata); }; 

And my PHP code is simple - it's just checking if everything is ok

 require("../includes/config.php"); //config folder to start the session if($_SERVER["REQUEST_METHOD"]=="POST"){ echo '<pre>',print_r($_FILES),'</pre>'; //dumping some variable and arrays to see where the problem is } 

The request I receive from the server is a warning: There is no border in the POST data with multipart / form-data in Unknown on line 0, but I sent formdata and the request header and I opened the file.

Answer 1

You just need to delete the following line:

ajax.setRequestHeader("Content-Type", "multipart/form-data");

Answer 2

Instead of sending data as multipart/form-data :

 ajax.setRequestHeader("Content-Type", "multipart/form-data"); 

You should send it as application/json :

 ajax.setRequestHeader("Content-Type", "application/json");