blueimp jQuery 파일 업로드가 실행되지 않음

Question

blueimp 파일 업로드 플러그인을 사용하여 이미지를 비동기 적으로 업로드하려고하지만 업로드하려고 시도하면 아무 일도 일어나지 않습니다. 어떤 콜백 함수도 전혀 트리거되지 않습니다. 이 함수를 사용하여 파일 업 로더를 파일 입력에 바인드합니다. 나는 이름이 다른 3 개 개의 입력을 가지고 있기 때문에 여러 파일 업로드 튜토리얼 here.에서 영감을받은

var initFileUpload = function (gender) { 
//Used to bind fileupload plugin and send files 

//bind file upload 
$('#add_form').fileupload({ 
    namespace: gender+'_image', 
    singleFileUploads: true, 
    formData: [{name:'gender', value: gender}], 
    fileInput: $("#"+gender+'_image'), 
    done: function(e, data){ 
     alert('success '+data.result); 
    } 

}); 
//Bind event callbacks 
$('#add_form').bind('fileuploadsend', function (e, data) { 
    console.log('sent'); 
}); 
$('#add_form').bind('fileuploaddone', function (e, data) { 
    console.log('done'); 
}); 
$('#add_form').bind('fileuploadfail', function (e, data) { 
    console.log(data.result); 
}); 
$('#add_form').bind('fileuploadalways', function (e, data) { 
    console.log(data.result); 
}); 

} 

나는 이런 식으로하고 있어요. 그런 다음 내 아약스 호출 내에서 수동으로 send 함수를 실행하거나 시도하고있다.

$.ajax({ 
     type: "POST", 
     url: "/manage/processadditem", 
     data: $("#add_form").serialize(), 
     dataType: "html", 
     success: function(response, textStatus, XHR) 
     { 
     if(response.indexOf('invalid') >= 0 || response.indexOf('Exception') >= 0){ 
      //Show them their errors 
      alert(response); 
     } 
     else{ 
      //Upload item images 
      //Send files 
      $('#add_form').fileupload('send', {fileInput: $("#neutral_image"), url: '/manage/items/itemimage/test' }); 
      $('#add_form').fileupload('send', {fileInput: $("#male_image"), url: '/manage/items/itemimage/test' }); 
      $('#add_form').fileupload('send', {fileInput: $("#female_image"), url: '/manage/items/itemimage/test' }); 
      alert('should have uploaded image to cdn.completeset.com/items/test_nla.jpg if gender was neutral'); 
     } 

     }, 
     error: function(jqXHR, textStatus, errorThrown){ 
     alert('An error occurred, please try again later.'); 
     } 
    }); 

나는 그래서 내가 파일을 보내는 데 사용할 노력하고있어입니다 수동 $('#fileupload').fileupload('send', {files: filesList}); 같은 라인을 사용하여 파일을 보낼 수있는 전송 방법을 사용할 수 있습니다 섹션 프로그래밍 파일 업로드에서 문서 here에서 발견. 불행히도 콜백 함수에서 어떤 종류의 응답도 얻지 못하고 있습니다. 이유는 모르겠습니다.

Answer 1

방금 ​​malsup 양식 플러그인으로 끝났습니다. http://malsup.com/jquery/form/#ajaxForm blueImp로 2 일 동안 고생하고 나면 이걸 가지고 몇 분 만에 작동합니다.

Answer 2

사용해보기, 실제 예제를 다운로드 할 수 있습니다.

jQuery Blueimp file uploader