2017-09-20 17 views
1

我有一個帶有1個文件輸入的表單,我的目標是存儲我用CTRL +單擊選擇的所有圖片。Laravel 5.5用1個文件輸入保存多張照片

我的ajax調用的響應總是隻返回1個文件名,我怎麼才能讓它返回所有文件的對象?

我的輸入字段:

<?php echo Form::file('photos[]', ['multiple', 'id' => 'photos']); ?> 

我的Ajax調用:

let token = $('meta[name="csrf-token"]').attr('content'); 
let photos = $('input[type=file]').val().split('\\').pop(); 

var values = { 
    photos: photos, 
} 

$.ajax({ 
    type: 'POST', 
    url: '/upload', 
    dataType: 'JSON', 
    data: { 
     "_method": 'POST', 
     "_token": token, 
     "values": values 
    }, 
    success:function(data){ 
     console.log('success'); 
     console.log(data); 
    }, 
    error:function(){ 
    }, 
}); 

我控制器的方法:

/** 
* Handles the upload of the images. 
* 
* @return Response 
*/ 
public function uploadSubmit(Request $request) 
{ 
    if ($request->isMethod('post')){ 

     $values = $request->values; 

     return response()->json([ 
            'response' => 'This is post method', 
            'values' => $values 
           ]); 
    } 
} 
+0

看看這篇文章:http://www.code-hound.com/upload-multiple-files-at-once-with-jquery-和-php/ –

回答

0

嘗試下面的代碼,並在Ajax代碼一些變化。在代碼中添加以下參數。

processData: false, 
contentType: false, 

並在AJAX啓動之前添加var formData = new FormData($("#formID")[0]);行。

或者檢查以下代碼並根據您的代碼進行更改。

你應該使用下面的jQuery代碼上傳使用AJAX提交。

var formData = new FormData($(form)[0]); 
$.ajax({ 
    url: form.action, 
    type: form.method, 
    data: formData, 
    processData: false, 
    contentType: false, 
    beforeSend: function (xhr) { 
     xhr.setRequestHeader('X-CSRF-Token', $("meta[name='_csrf']").attr("content")); 
    }, 
    success: function (response) { 

    } 
}); 

控制器端代碼:

foreach($request->only('files') as $files){ 
    foreach ($files as $file) { 
     if(is_file($file)) { // not sure this is needed 
      $fname = $file->getClientOriginalName(); 
      $string = str_random(16); 
      $ext = $file->guessExtension(); 
      $file_name = $string . '.' . $ext; 
      $filepath = 'uploads/' . $file_name; 
      $file->storeAs('uploads/', $file_name); 
     } 
    } 
} 
+0

我試過這個,它似乎是更好的工作,但我沒有得到的信息(文件名等)我上傳的圖像 – Chris

+0

你有任何想法如何我可以得到的文件的數據? – Chris

+0

更新回答希望能幫到這個 –