How to validate multiple files in array Laravel? - php

Question

I have use this form for uploading multiple files. But i have used jQuery for append multiple file input. I have try multiple method for validate in laravel but its not working. If we used only single file validate its working. But if we used multi file validation its not working.
If we use this and upload all file at a time in with multiple attribute file input its working.
If we upload multiple file one by one after that its not working.
// My View
#include('flash.flash_message')
<form action="{{route('company.upload')}}" method="post" id="formUpload">
<div id="newinput">
<input type="file" name="files[]" class="form-control" />
</div>
<input type="submit" value="uplaod" />
</form>
<div class="btn btn-info" id="add_btn">Add</div>
// My jQuery
$(document).on('click','#add_btn',function(){
var newRowAdd =
'<input type="file" name="files[]" class="form-control" />';
$('#newinput').append(newRowAdd);
});
// My Controller
<?php
public function store(Request $request)
{
$request->validate([
'files' => 'required',
'files.*' => 'mimes:doc,docx|max:15720',
] );
try
{
$array = [
'created_at'=>date('Y-m-d H:i:s')
];
$data = Company::create($array);
// there my uplaoding code
if($request->hasFile('file'))
{
$newData = Company::findOrFail($data->id);
$docs = array();
$files = $request->file('file');
if($files){
foreach($files as $file) {
$fileName = time().rand(100000,999999).'_'.$data->id.'.'.$file->extension();
$docs[] = $fileName;
$file->move(public_path('company'), $fileName);
}
}
$newData->doc = !empty($result) ? serialize($result) :'';
$newData->updated_at = date('Y-m-d H:i:s');
$newData->save();
}
}
catch(\Exception $e)
{
return redirect()->back()->with('error',$e->getMessage());
}
}
// I Also used this
$input_data = $request->all();
$validator = Validator::make(
$input_data, [
'files.*' => 'required|mimes:jpg,jpeg,png,bmp|max:20000'
],[
'files.*.required' => 'Please upload an image',
'files.*.mimes' => 'Only jpeg,png and bmp images are allowed',
'files.*.max' => 'Sorry! Maximum allowed size for an image is 20MB',
]
);
if ($validator->fails()) {
// Validation error..
}

Answer 1

var i = 1;
jQuery("#addRow").click(function () {
var html = '';
var scr = '';
html += '<div id="addedRow" class="form-row mb-4">';
html += '<div class="form-group col-md-4">';
html += '<label for="filename[' + i + ']">File type</label>';
html += '<span class="text-danger">*</span>';
html += '<select class="form-control" id="filename' + i + '" name="filename[' + i + ']" required><option selected="selected" value="">Select file type</option><option value="claim">Claim</option><option value="reimbursements">Reimbursements</option><option value="policy">Policy</option><option value="ecards">Ecards</option><option value="data">Data</option><option value="others">Others</option></select>';
html += '<span class="badge">';
html += '<small id="sh-text4" class="form-text mt-0">Select the file type you are uploading/linking</small>';
html += '</span>';
html += '</div>';
html += '<div id="Other' + i + '" class="form-group col-md-4">';
html += '<label for="other[' + i + ']">Specify file type</label> <span class="text-danger">*</span>';
html += '<input class="form-control" placeholder="Specify the file type" name="other[' + i + ']" type="text" id="other[' + i + ']" >';
html += '<span class="badge">';
html += '<small id="sh-text4" class="form-text mt-0">Specify the file type as you selected the file as "Other"</small>';
html += '</span>';
html += '</div>';
html += '<div id="upload' + i + '" class="form-group col-md-4">';
html += '<label for="upload[' + i + ']">Upload file</label>';
html += '<span class="text-danger">*</span>';
html += '<input class="form-control" name="upload[' + i + ']" type="file" id="upload[' + i + ']" required>';
html += '<span class="badge">';
html += '<small id="sh-text4" class="form-text mt-0">Upload the file | Formats allowed: <strong>PDF, DOC, ZIP, JPG, PNG GIF and Excel</strong></small></span>';
html += '</div>';
html += '<div class="form-group col-md-4" style="padding-top: 30px;">';
html += '<button id="removeRow" type="button" class="btn btn-danger">Remove</button>';
html += '</div>';
html += '</div>';
jQuery('#newRow').append(html);
scr += '<script';
scr += '>$(document).ready(function(){ $("#filename' + i + '").change(function () { if ($(this).val() === "others") {$("#Other' + i + '").show(); document.getElementById("other[' + i + ']").required=true}else{ $("#Other' + i + '").hide(); document.getElementById("other[' + i + ']").required=false;}}); $("#Other' + i + '").hide(); }); </';
scr += 'script>';
jQuery('#newScript').append(scr);
i++;
});
// remove row
jQuery(document).on('click', '#removeRow', function () {
i--;
$(this).closest('#addedRow').remove();
});
This is how I have implemented this in my project you can see there is a variable that you need to pass here
<input type="file" name="files['+i+']" class="form-control" />;
You have to increase the value of i once the row is added