Pass Validation Import Excel to Form using JSON/AJAX- Laravel - laravel-8

Question

I try Laravel import excel using Maatweb. I want to 'handling error' using Javascript in my form. This is my code.
EmployeeImport
public function collection(Collection $rows)
{
Validator::make($rows->toArray(), [
'*.nik' => 'required',
'*.name' => 'required',
'*.id_department' => 'required',
'*.id_position' => 'required',
'*.id_group' => 'required',
'*.id_meet_point' => 'required',
])->validate();
foreach ($rows as $row) {
Employee::create([
'nik' => $row['nik'],
'name' => $row['name'],
'id_department' => $row['id_department'],
'id_position' => $row['id_position'],
'id_group' => $row['id_group'],
'id_meet_point' => $row['id_meet_point'],
]);
}
}
EmployeeController
public function import_excel(Request $request)
{
if($request->ajax()){
try {
$file = $request->file('file');
$nama_file = rand().$file->getClientOriginalName();
$file->move('file_employee', $nama_file);
Excel::import(new EmployeeImport, public_path('/file_employee/'.$nama_file));
return response()->json([
'status' => 200,
'message' => 'Berhasil di Import'
]);
} catch (\Maatwebsite\Excel\Validators\ValidationException $e) {
$failures = $e->failures();
foreach($failures as $failure)
{
return response()->json([
'status' => 422,
'errors' => $failure->errors(),
]);
}
}
}
}
v_employee.blade
$("#importpost").on("submit", function(e) {
e.preventDefault();
var extension = $('#file_upload').val().split('.').pop().toLowerCase();
if ($.inArray(extension, ['csv', 'xls', 'xlsx']) == -1) {
alert('Please choose file csv/xls/xlsx!');
} else {
var file_data = $('#file_upload').prop('files')[0];
var form_data = new FormData();
form_data.append('file', file_data);
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
}
});
$.ajax({
url: "{{route('employee.import')}}",
data: form_data,
type: 'POST',
contentType: false,
cache: false,
processData: false,
success: function(response) {
/* if (response.status == 442) {
$('#importform_errList').show();
$('#importform_errList').html('');
$('#importform_errList').addClass('alert alert-danger');
$('#importform_errList').append('<li>' + response.message + '</li>');
} */
console.log(response.status);
/* $('#importExcel').modal('hide');
tampil_table(); */
}
});
}
});
I have tried this code but still not show on my form for the validation. The error log still 422 (Unprocessable Content). Any help me ? What's wrong with my code?

Answer 1

I find other ways to showing validation error in my form.
So I changed my code like this.
$.ajax({
url: "{{route('employee.import')}}",
data: form_data,
type: 'POST',
contentType: false,
cache: false,
processData: false,
success: function(response) {
if (response.status == 200) {
Swal.fire({
icon: 'info',
title: 'Success',
text: 'Import File Berhasil',
showCancelButton: false,
showConfirmButton: true,
confirmButtonColor: '#fb3'
});
$('#importExcel').modal('hide');
tampil_table();
} else {
Swal.fire({
icon: 'error',
title: 'Failed',
text: 'Import Gagal. Silahkan cek table excel!',
confirmButtonColor: '#fb3',
showCancelButton: false,
showConfirmButton: true
});
}
},
error: function(data){
//console.log(data);
Swal.fire({
icon: 'error',
title: 'Failed',
text: 'Import Gagal. Silahkan cek table excel!',
confirmButtonColor: '#fb3',
showCancelButton: false,
showConfirmButton: true
});
}
});
I add error: function(), because validation define in this function. I just add error message with my custom word. Becase I don't know how showing up error(message) of the validation this function. I just share documentation.