Laracast13's avatar

Laravel filepond multi images upload

Hello

Using filepond for uploading files.

Have filed where uploading multi images

   <form method="POST" action="{{route('store')}}" enctype="multipart/form-data">
      @csrf
                       <input id="photos" name="image[]" type="file" 
                       multiple 
                       data-allow-reorder="true"
                       data-max-file-size="3MB"
                       data-max-files="3"
                      >
 <button type="submit" class="btn btn-success float-right">Add </button> 
</form>


<script>
  FilePond.registerPlugin(FilePondPluginImagePreview);
const inputElement = document.querySelector('input[id="photos"]');
const pond = FilePond.create( inputElement );
 
FilePond.setOptions({
server:{
    url: '/photo', 
    process: '/uploads',
    revert: '/delete',
    headers: {
          'X-CSRF-TOKEN': '{{ csrf_token() }}'
          }
        }

}); 
</script>

Route::post('/photo/uploads', [App\Http\Controllers\PhotoController::class, 'uploads']);
Route::delete('/photo/delete', [App\Http\Controllers\PhotoController::class, 'delete']);
Route::delete('/photo/add', [App\Http\Controllers\PhotoController::class, 'store']);

When attaching photo this function works creating folder with image and returns full path (https://ibb.co/QCXwJ57)

    public function uploads(Request $request)
    {
     if($request->hasFile('image')){ 
         
        $files = $request->file('image');  

           foreach ($files as $file) {
                    $filename = $file->getClientOriginalName();
                    $folder = uniqid();
                    $file->move("uploads/tmp/" . $folder,$filename);
                    $url = "uploads/tmp/" . $folder . "/" . $filename;
                    
                    return $url;
            }
            
            
     } 
     return '';
    }

Now I want store this path in DB. But can not catch response path to save it

    public function store(Request $request)
    {   
   foreach ($request->image as $file) {
     TemporaryFile::create([ 
          'source'=> $file,
      ]);
     }  
    }

getting error 'source' is null

0 likes
9 replies
fftfaisal's avatar

Are you using temporary model ? if yes then you need to store file when you are uploading files

public function uploads(Request $request) { if($request->hasFile('image')){

    $files = $request->file('image');  

       foreach ($files as $file) {
                $filename = $file->getClientOriginalName();
                $folder = uniqid();
                $file->move("uploads/tmp/" . $folder,$filename);
                $url = "uploads/tmp/" . $folder . "/" . $filename;

				 TemporaryFile::create([ 
                      'source'=> $url,
                 ]);  
                return $url;
        }
        
        
 } 
 return '';

}

then in you main form store controller you can fetch the file path using source path and then the file into form db.

you can see this video https://www.youtube.com/watch?v=GRXaCfS1qj0

Laracast13's avatar

@FighterCoder Hi, I fix my problem but code was changed

public function photoUploads(Request $request)
{
    $year_folder = date("Y");
    $month_folder = date("m");
    $path_year = "uploads/posts/".$year_folder;   
    $path_month = $path_year."/".$month_folder."/";       
    if(!File::exists($path_year)) {
        File::makeDirectory($path_year, 0775, true);
    }
    if(!File::exists($path_month)) {
        File::makeDirectory($path_month, 0775, true);
    }
    $path = $path_month;

 if($request->hasFile('productImage')){         
    $productImages = $request->file('productImage');     
       foreach ($productImages as $productImage) {
            $productName = hexdec(uniqid()).'.'.$productImage->extension();       
                Image::make($productImage)->resize(1200, 1200, function ($constraint) {$constraint->aspectRatio();$constraint->upsize();})->insert('dist/img/watermark.png', 'bottom-right', 10, 10)->save($path.$productName);
            $productUrl = $path . $productName;
            return $productUrl;
        }
 } 
}

if($request->productImage){            
            foreach ($request->productImage as $productImage) {
            Gallery::create([ 
                'image'=> $productImage,
                'product_id'=> $product->id,
            ]);
            }
}

p.s. if you can share your code i will try to help

FighterCoder's avatar

@www888 ok thank u , I am using a form with multiple upload image + text input

this is the function for FilePond :

public function temp_upload(Request $request) {

    $folder=public_path('avatars/tmp');

    if($request->hasfile('data'))
{
    $file = $request->file('data');
    $filename =uniqid() . '-' . $file->getClientOriginalName();

    $file->move($folder,$filename);

    return $filename;
}
return "";


}

it return name of file correctly but when i try to submit the whole form i find just the input text and name of one image not all of them using dd($request) but when i check the requete i find the whole data of form even the all images:

Laracast13's avatar

@FighterCoder You need use foreach

if($request->hasFile('data')){         
        $images = $request->file('data');     
           foreach ($images as $image) {
              // Save file
            }
     }
FighterCoder's avatar

@www888 no this is a function just for uploading files temporary it return the name of each file correctly, the problem is when i try to store the files from the temp file to another the request get just one file name not all of them

Please or to participate in this conversation.