如何使用formData在laravel上傳文件jquery ajax

我正在使用laravel 5.4和jQuery Ajax來上傳文件和一些表單數據。如何使用formData在laravel上傳文件jquery ajax

我使用下面的代碼

function submitDocument(){ 
    var formData = new FormData(); // Currently empty 
    var _token = $("#_token").val().trim(); 
    formData.append('title', $("#title").val()); 
    formData.append("doc",$("#doc")[0].files[0]); 
    $.ajax({ 
     url: "documents", 
     method: "post", 
     data:{_token,formData}, 
    }).done(function(data) { 

    }); 
    return false;// Not to submit page 
}

而且我得到錯誤

Uncaught TypeError: Illegal invocation

我該如何解決這個問題？在此先感謝您的時間。

我能夠通過使用

console.log(formData.get('title')); 
console.log(formData.get('doc'));

來源

2017-11-18 C2486

您是否嘗試過加入FORMDATA對象內部_token價值？ – gbalduzzi

@gbalduzzi：是的我試過了，沒有成功。 – C2486

似乎是一個重複︰https://stackoverflow.com/questions/6974684/how-to-send-formdata-objects-with-ajax-requests-in-jquery –

嘗試在你的代碼中加入processData: false, contentType: false以獲得FORMDATA值

本替換你的腳本：

function submitDocument(){ 
var formData = new FormData(); // Currently empty 
var _token = $("#_token").val().trim(); 
formData.append('title', $("#title").val()); 
formData.append("doc",$("#doc")[0].files[0]); 
$.ajax({ 
    url: "documents", 
    method: "post", 
    data:{_token,formData}, 
    cache : false, 
    processData: false, 
    contentType: false 
}).done(function(data) { 

}); 
return false;// Not to submit page 
}

通過默認情況下，作爲對象傳遞給數據選項的數據t將被處理並轉換爲一個查詢字符串，以適應默認的內容類型「application/x-www-form-urlencoded」。如果要發送DOMDocument或其他未處理的數據，請將此選項設置爲false。

來源

2017-11-18 09:14:50 Vinothini

我的代碼不會去控制器，因爲使用'processData：false，'我得到「令牌不匹配錯誤」 – C2486

在contentType之後使用此頭部：false '頭部：{X-CSRF-Token'：$（'meta [name =「csrf-token」]' ）.attr（'content'） }，' – Vinothini

我試過這個，但沒有得到'title'或'doc'的任何值 – C2486

嘗試這種方式

$(document).ready(function(){ 
$("#form").on('submit',(function(e){ 
     e.preventDefault(); 
     var formdata = new FormData(this); 
     var _token = $("#_token").val().trim(); 
     formData.append('title', $("#title").val()); 
     formData.append("doc",$("#doc")[0].files[0]); 
     $.ajax({ 
      url: "/site/url", 
      type: "POST", 
      data:{token:_token,formData}, 
      contentType: false, 
      cache: false, 
      processData:false, 
      success: function(data){ 

      }, 
     }); 
    }));});

來源

2017-11-20 13:37:56

<script> 
$(document).ready(function() { 
    var url = "{{ url('/admin/file') }}"; 
    var options = { 
      type: 'post', 
      url: url,  
      headers: {'X-CSRF-TOKEN': '{{ csrf_token() }}'}, 
      dataType: 'doc', 
      cache: false, 
      contentType: false, 
      processData: false, 
      success: function (data) { 
       alert('Ok'); 
      }, 
      error: function (data) { 
       alert('Error'); 
      } 
    }; 
    $('#save').on('click', function() { 
     $("#form").ajaxSubmit(options); 
     return false; 
    }); 
}); 
</script>

來源

2017-11-20 13:49:12 wolacinio

如何使用formData在laravel上傳文件jquery ajax

回答

相關問題