Insert Multipe Data into Database with Image in Laravel

Question

I do think that my code is incorrect since I do not know how to insert multiple image into database using array? But, other data such as defect_id,description and report_by is okay, the multiple data can still be inserted. Before I implement if ($request->hasFile('image')) {....} my image in database contains C:\wamp64\tmp\phpF1E1.tmp. After I implemet that code, there is nothing happened when I enter submit. All data is not inserted into the database.

complaints table

id
defect_id
image
description
report_by

ComplaintController.php

use Auth;
use Validator;
use Response;
use App\Complaint;
use Illuminate\Http\Request;
use Intervention\Image\ImageManagerStatic as Image;

class ComplaintController extends Controller
{
    public function index()
    {
        return view('buyers.complaint');
    }

    public function create(Request $request)
    {
       $this->validate($request,[
          'defect_id'=>'required',
          'image'=>'image|mimes:jpeg,png,jpg,gif,svg',
          'description'=>'max:255',
        ]);

        if ($request->hasFile('image')) {
            $image = $request->file('image');
            $filename = $image->getClientOriginalName();

            $image_resize = Image::make($image->getRealPath());
            $image_resize->resize(900, 630);
            $image_resize->save('complaint/' . $filename);
        }

        if (count($request->defect_id) > 0) {
            foreach($request->defect_id as $item=>$v) {
                $data = array(
                    'defect_id' => $request->defect_id[$item],
                    'image' => $filename,
                    'description' => $request->description[$item],
                    'report_by' => auth()->user()->typable->buyer_id
                );

                Complaint::insert($data);
            }
        }
        return redirect('/report-form')->with('success','Your report is submitted!');
    }

complaint.blade.php

<div class="panel-heading">
   <h3 class="panel-title"><strong>Make New Report</strong></h3>
</div>
<div class="panel-body">
   <div>
      <div class="panel">
         <form action="/report-create" method="post" enctype="multipart/form-data">
         {{ csrf_field() }}
            <table class="table table-bordered">
               <thead>
                  <tr>
                     <th><center>Type of Defect</center></th>
                     <th><center>Image</center></th>
                     <th><center>Description</center></th>
                     <th><center>Action</center></th>
                  </tr>
               </thead>
               <tbody>
                  <tr>
                     <td width="20%">
                         <select class="form-control" name="defect_id[]">
                         <option value="" selected>Choose Defect</option>
                             @foreach(App\Defect::all() as $defect)
                                 <option value="{{$defect->id}}">{{$defect->name}}</option>
                             @endforeach
                     </td>
                     <td width="15%">
                         <input type="file" class="form-control-file" name="image[]">
                     </td>
                     <td width="45%">
                         <input type="text" class="form-control" name="description[]">
                     </td>
                     <td width="10%">
                         <button type="button" class="btn btn-info btn-sm" id="add-btn"><i class="glyphicon glyphicon-plus"></i></button>
                     </td>
                  </tr>
               </tbody>
            </table>
         <center><button type="submit" class="btn btn-primary">Submit</button></center>
         <br>
       </form>
     </div>
   </div>
</div>

javascript in blade

<script>
    $(document).ready(function () {
        $('#add-btn').on('click',function () {
            var html = '';
            html += '<tr>';
            html += '<td><select class="form-control" name="defect_id[]"><option value="" selected>Choose Defect</option>@foreach(App\Defect::all() as $defect)<option value="{{$defect->id}}">{{$defect->name}}</option>@endforeach</td>';
            html += '<td><input type="file" class="form-control-file" name="image[]"></td>';
            html += '<td><input type="text" class="form-control" name="description[]"></td>';
            html += '<td><button type="button" class="btn btn-danger btn-sm" id="remove-btn"><i class="glyphicon glyphicon-minus"></i></button></td>';
            html += '</tr>';
            $('tbody').append(html);
        })
    });

    $(document).on('click','#remove-btn',function () {
        $(this).closest('tr').remove();
    });
</script>

Or anyone that can help me have any other suggestion to solve my problem by writing the actual code?

Answer 1

Based on @Kamlesh Paul post, here is my updated answer.

 public function create(Request $request)
    {
        if (count($request->defect_id) > 0) {
            foreach($request->defect_id as $item=>$v) {
                if (isset($request->image[$item])) {
                    $images = $request->file('image');
                    $image_resize = Image::make($images[$item]->getRealPath());
                    $image_resize->resize(900, 630);
                    $filename = $images[$item]->getClientOriginalName();

                    Storage::put($filename, $image_resize);
                    Storage::move($filename, 'public/complaint/' . $filename);
                }
                $data = array(
                    'defect_id' => $request->defect_id[$item],
                    'image' => $filename,
                    'description' => $request->description[$item],
                    'report_by' => auth()->user()->typable->buyer_id,
                    'created_at' => Carbon::now()->toDateTimeString(),
                    'updated_at' => Carbon::now()->toDateTimeString()
                );

                Complaint::insert($data);
            }
        }
        return redirect('/report-form')->with('success','Your report is submitted!');
    }

Answer 2

use this as you are already in one loop so you can use that loop for image as well

if (count($request->defect_id) > 0) {
    foreach($request->defect_id as $item=>$v) {


        if (isset($request->image[$item])) {
            $images = $request->file('image');
            $filename = $images[$item]->getClientOriginalName();

            $image_resize = Image::make($images[$item]->getRealPath());
            $image_resize->resize(900, 630);
            $image_resize->save('complaint/' . $filename);
        }
        $data = array(
            'defect_id' => $request->defect_id[$item],
            'image' => $filename,
            'description' => $request->description[$item],
            'report_by' => auth()->user()->typable->buyer_id
        );

        Complaint::insert($data);
    }
}

in above code description[$item] will have $images[$item] like 0 index description will be having 0 index image

Answer 3

To insert multi image

if ($request->hasFile('image')) {
   $files = $request->file('image');
   foreach($files as $file) {
      $filename = $file->getClientOriginalName();
      $image_resize = Image::make($image->getRealPath());
      $image_resize->resize(900, 630);
      $image_resize->save('complaint/' . $filename);
  }

}