php - How to use $.ajax() to Upload Files -

i message when try use $_files image name.

notice: undefined index: image in c:\xampp\htdocs\upload_form\upload_query.php on line 10

i have form uploads information image mysql database (phpmyadmin), , form cleared using javascript user can upload image , information. have read can't use $_files javascript, unsure why, appreciate solution.

i new php, , javascript.

this javascript.

$('form').on('submit',function() { var that= $(this),     url = that.attr('action'),     type = that.attr('method'),     data = {};      that.find('[name]').each(function(index,value) {            var = $(this),            name = that.attr('name'),            value = that.val();             data[name] = value;     });   $.ajax({          url: url,          type: type,           data: data,          success: function(response){                   console.log(response);          }  });   document.getelementbyid("upload_form").reset(); return false; }); 

this php.

 //image properties  $name   = $_files['image']['name'];  $size   = $_files['image']['size'];  $temp   = $_files['image']['tmp_name'];  $error  = $_files['image']['error'];  $type   = $_files['image']['type'];  //**************** 

this part of form.

<form action='upload_query.php' class='appnitro' enctype='multipart/form-data' id='upload_form' method='post' name='upload_form'>   <ul>     <li id='li_1'>       <label class='description' for='image'>upload picture</label>           <div>         <input class='element file' id='image' name='image' required="" type='file'>       </div>     </li>         <li id='li_2'><label class='description' for='name'>name</label> <span><input class='element text' id='first_name' maxlength='255' name='first_name' placeholder='first name.' required="" size='12' value=''></span> <span><input class='element text' id='last_name' maxlength='255' name='last_name' placeholder='last name.' required="" size='18' value=''></span></li>   </ul> </form> 

etc.

---

yes can upload files using $.ajax here how

first let's have typical form id. form can include 1 or many files wish.

<form id='fileupload' method='post' enctype="multipart/form-data" ... 

then in jquery following.

$('#btnupload').click(function () {     //the key formdata object     var formdata = new formdata(document.getelementbyid('fileupload'));     $.ajax({         url: 'upload.php', //server script process data         type: 'post',         success: function (json) {}         data: formdata,         datatype: "json",         cache: false,         contenttype: false,         processdata: false     }); }); 

the key here using javascript formdata object construct data parameter of $.ajax