Laravel - Insert Dynamic Images Arrays JQuery on Database in One Column - php

Question

I need to store my images in the database in one column dynamically I have no idea how to do it please help me. thank you in advance here is my view controller and model. Here is an image, Below there are an array that on Choose File Button. I want to store them into the database in a column how to do that?
My Database Table name is InflightMagazine
My VIEW code
{!! Form::open(['action'=>'Admin\InflightMagazines#store', 'method' => 'POST','enctype'=>'multipart/form-data']) !!}
<div class="table-responsive">
<table class="table table-bordered" id="dynamic_field">
<tr class="form-row">
<td> <b>{{ Form::text('inflightmagz_date[]', date('F Y') , ['class' => 'form-control', 'id'=>"exampleFormControlFile1"])}}</b><br>
{{ Form::file('infightmagazine_pdf[]',['id'=>'exampleFormControlFile1']) }}
{{ Form::button('', ['class' => 'btn btn-success fa fa-plus-circle addFile', 'id'=>'addFile','name'=>'addFile', 'style'=>'font-size:15px;']) }}
</td>
<td>{{ Form::button('', ['class' => 'btn btn-success fa fa-plus-circle add', 'id'=>'add','name'=>'add', 'style'=>'font-size:15px;']) }}</td>
</tr>
</table>
{{Form::submit('submit', ['class'=>'btn btn-primary', 'name'=>'submit'])}}
</div>
{!! Form::close() !!}
AJAX / JQuery Code
<script>
$(document).ready(function() {
var len = $('.form-row').length;
$(document).on('click', '.add', function() {
$('#dynamic_field').append('<tr class="form-row" data-id="'+len+'"><td> {{ Form::text('inflightmagz_date[]', date('F Y') , ['class' => 'form-control', 'id'=>"exampleFormControlFile1"])}} <br> {{ Form::file('infightmagazine_pdf[]',['id'=>'exampleFormControlFile1']) }} {{ Form::button('', ['class' => 'btn btn-success fa fa-plus-circle addFile', 'id'=>'addFile','name'=>'addFile', 'style'=>'font-size:15px;']) }}</td><td><button type="button" name="remove" class="btn btn-danger fa fa-minus-circle btn_remove_all"></button></td></tr>');
});
$(document).on('click', '.submit', function() {
$.ajax({
method: "POST",
data: $('#add_name').serialize(),
success: function(data) {
alert(data);
$('#add_name')[0].reset();
}
});
});
$(document).on('click', '.addFile', function() {
var id = $(this).closest('.form-row').data('id');
var elem = '<tr class="'+id+'"><td>{{ Form::file('infightmagazine_pdf[]',['id'=>'exampleFormControlFile1']) }}<button type="button" name="remove" class="btn btn-danger btn_remove fa fa-minus-circle"></button></td></tr>';
$(elem).insertAfter($(this).closest('tr'));
});
$(document).on('click', '.btn_remove, .btn_remove_all', function() {
if($(this).hasClass('btn_remove_all')){
var id = $(this).closest('.form-row').data('id');
$('tr.'+id).remove();
}
$(this).closest('tr').remove();
});
});
</script>
Controller Storing Function code
public function store(Request $request){
$this->validate($request, [
'inflightmagz_date' => 'required',
'infightmagazine_pdf' => 'required'
]);
if ($request->has('infightmagazine_pdf')){
//Handle File Upload
$inflightmags = [];
foreach ($request->file('infightmagazine_pdf') as $key => $file){
// Get FileName
$filenameWithExt = $file->getClientOriginalName();
//Get just filename
$filename = pathinfo( $filenameWithExt, PATHINFO_FILENAME);
//Get just extension
$extension = $file->getClientOriginalExtension();
//Filename to Store
$fileNameToStore = $filename.'_'.time().'.'.$extension;
//Upload Image
$path = $file->storeAs('public/infightmagazine_pdfs',$fileNameToStore);
array_push($inflightmags, $fileNameToStore);
}
$fileNameToStore = serialize($inflightmags);
}
}

Answer 1

I think what you are looking for is attribute casting to array
https://laravel.com/docs/5.7/eloquent-mutators#attribute-casting
this will allow you to save an array of file locations to a single field in the DB and retrieve them as an array
I would remove the serialise on the $fileNamesToStore
Hope this helps