HTML Script:
First we create a simple HTML script that contains input file tag and a button as a trigger.<!DOCTYPE html> <html> </html>
JS Script:
make sure you already included the JQuery file.$("#id_of_file_tag").click(function(){ var formdata = new FormData(); var file = $("#certi")[0].files[0]; formdata.append('certi',certi); $.ajax({ url: "http://localhost/ajaxuploader.php", type: "POST", data: formdata, processData: false, contentType: false, }); });
FormData accomodates html's form entities. it is used by create new object of FormData class. after you created it you append all of html's form entites.
files attribute is a attribute to get the html's file tag features on javascript. after you get the file you can post it through AJAX and receive on server side as $_FILE variable.
PHP Script:
here we'll get the uploaded file and process it. we receive the uploaded file, validate it and move it to desire directory using PHP's function.
<?php if(isset($_FILES['certi']) && $_FILES['certi']['error'] == 0){ if(move_uploaded_file($_FILES['certi']['tmp_name'], 'uploads/'.$_FILES['certi']['name'])){ echo '{"status":"success"}'; exit; } } ?>Enjoy!!