JQuery файл Загрузить и Аякса

Question

Итак, у меня есть следующие формы и JS/PHP:

PHP

<form enctype="multipart/form-data"> 
    <input id="fileupload" type="file" name="files[]" class="files " onChange="UploadImage" accept='image/*'/> 
    <input type="button" class="submit_form" value="submit">  
</form> 

<?php 
    add_action('wp_ajax_UploadImage', 'UploadImage'); 
    function UploadImage() 
    { 
    $upload_dir = wp_upload_dir(); 
    $files = $_FILES['files']; 
    //Some function 
    } 
?> 

JS

function UploadImage(e) 
{ 
jQuery('#fileupload').fileupload({ 
    url: upload_image.ajax_url, 
}); 

if(jQuery('#fileupload')) { 
    var form = document.forms.namedItem("upload_video"); 
    var formdata = new FormData(form); 
    formdata.append('action', 'UploadImage'); 
    jQuery.ajax({   
     success : function(data){     
       alert('sddsf'); 
      } 
    }) 
} 
}; 

Как вы можете видеть здесь , когда изображение выбрано с использованием Blueimp jQuery File upload (что js неправильно написано), я хочу, чтобы файл изображения обрабатывался с помощью php-функции.

Другими словами, js написано неправильно, и я не уверен, как инициировать плагин, а затем, когда изображение выбрано, оно обрабатывается функцией php через ajax (что означает, как я разбираю информацию о файле к функции php через ajax?)

Answer 1

Не используйте $.ajax напрямую. Плагин уже делает это за кулисами.

Вот рабочий пример, основанный на коде, но адаптированный для работы на JSFiddle:

$(document).ready(function(){ 
    var url = '/echo/json/'; 
    var formdata = {json: JSON.stringify({field1: 'value1'})}; 

    jQuery('#fileupload').fileupload({ 
     url: url, 
     formData : formdata,   
     dataType: 'json', 
     type: "POST", 
     contentType:false, 
     processData:false, 
     success : function(data){     
      alert('success...'); 
      console.dir(data); 
     } 
    });  
}); 

Демо: http://jsfiddle.net/pottersky/8usb1sn3/3/