So I have Laravel project and I use Ajax for CRUD.
This is my Controller
:
/**
* Store a newly created resource in storage.
*
* @param IlluminateHttpRequest $request
* @return IlluminateHttpResponse
*/
public function store(Request $request)
{
$rules = array(
'naziv' => 'required|max:90|unique:restaurants',
'adresa' => 'required|max:150',
'min_dostava' => 'required|max:5',
'vrijeme_dostave' => 'required|max:10',
'cijena_dostave' => 'required|max:5',
'podrucije_grada' => 'required',
'br_telefona' => 'required|numeric|unique:restaurants',
'kuhinja_id' => 'required',
'user_id' => 'required',
'lokacija' => 'max:999',
);
$error = Validator::make($request->all(), $rules);
if($error->fails())
{
return response()->json(['errors' => $error->errors()->all()]);
}
// logo
$logo = $request->file('logo');
$filename = $logo->getClientOriginalName();
//Fullsize
$logo->move(public_path().'/uploads/',$filename);
$image_resize = Image::make(public_path().'/uploads/'.$filename);
$image_resize->fit(800, 600);
$image_resize->save(public_path('uploads/'.$filename));
// logo finish
$restaurant = Restaurant::updateOrCreate(['id' => $request->restaurant_id],
[
'naziv' => $request->naziv,
'adresa' => $request->adresa,
'min_dostava' => $request->min_dostava,
'vrijeme_dostave' => $request->vrijeme_dostave,
'cijena_dostave' => $request->cijena_dostave,
'podrucije_grada' => $request->podrucije_grada,
'br_telefona' => $request->br_telefona,
'kuhinja_id' => $request->kuhinja_id,
'user_id' => $request->user_id,
'lokacija' => $request->lokacija,
'logo' => $filename
]);
$restaurant->save();
if($restaurant->wasChanged()){
return response()->json(['success'=>'Uspjesno ste izmijenili restoran.']);
}
return response()->json(['success'=>'Uspjesno ste dodali novi restoran.']);
}
And a part of form where is file input
in my blade
:
<div class="form-group">
<label for="exampleFormControlFile1" class="form-control-sm">Logorestorana</label>
<input type="file" class="form-control-file" id="logo" name="logo" value="">
</div>
And my jquery
script:
<script type="text/javascript">
$(function () {
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
}
});
var table = $('#dataTable').DataTable({
processing: true,
serverSide: true,
ajax: "{{ route('admin.restaurants.index') }}",
columns: [
{data: 'id', name: 'id'},
{data: 'logo', name: 'logo'},
{data: 'naziv', name: 'naziv'},
{data: 'adresa', name: 'adresa'},
{data: 'min_dostava', name: 'min_dostava'},
{data: 'vrijeme_dostave', name: 'vrijeme_dostave'},
{data: 'cijena_dostave', name: 'cijena_dostave'},
{data: 'podrucije_grada', name: 'podrucije_grada'},
{data: 'br_telefona', name: 'br_telefona'},
{data: 'kuhinja_id', name: 'kuhinja_id'},
{data: 'user_id', name: 'user_id'},
{data: 'lokacija', name: 'lokacija'},
{data: 'action', name: 'action', orderable: false, searchable: false},
]
});
$('#createNewProduct').click(function () {
$('#saveBtn').val("create-product");
$('#restaurant_id').val('');
$('#productForm').trigger("reset");
$('#modelHeading').html("Create New Product");
$('#ajaxModel').modal('show');
});
$('body').on('click', '.editProduct', function () {
var restaurant_id = $(this).data('id');
$.get("{{ route('admin.restaurants.index') }}" +'/' + restaurant_id +'/edit', function (data) {
$('#modelHeading').html("Edit Product");
$('#saveBtn').val("edit-user");
$('#ajaxModel').modal('show');
$('#restaurant_id').val(data.id);
$('#naziv').val(data.naziv);
$('#adresa').val(data.adresa);
$('#min_dostava').val(data.min_dostava);
$('#vrijeme_dostave').val(data.vrijeme_dostave);
$('#cijena_dostave').val(data.cijena_dostave);
$('#podrucije_grada').val(data.podrucije_grada);
$('#br_telefona').val(data.br_telefona);
$('#kuhinja_id').val(data.kuhinja_id);
$('#br_telefona').val(data.br_telefona);
$('#lokacija').val(data.lokacija);
$('#logo').val(data.logo);
})
});
$('#saveBtn').click(function (e) {
e.preventDefault();
$(this).html('+ Novi restoran');
$.ajax({
data: $('#productForm').serialize(),
url: "{{ route('admin.restaurants.store') }}",
type: "POST",
dataType: 'json',
success: function (data) {
var html = '';
if(data.errors)
{
html = '<div class="alert alert-danger">';
for(var count = 0; count < data.errors.length; count++)
{
html += '<p>' + data.errors[count] + '</p>';
}
html += '</div>';
}
if(data.success)
{
html = '<div class="alert alert-success alert-dismissible fade show" role="alert"><strong><i class="fas fa-check-circle"></i> ' + data.success + '</strong><button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">×</span></button></div>';
$('#productForm').trigger("reset");
$('#ajaxModel').modal('hide');
table.draw();
}
$('#form_result').html(html);
}
});
});
$('body').on('click', '.deleteProduct', function () {
var restaurant_id = $(this).data("id");
confirm("Are You sure want to delete !");
$.ajax({
type: "DELETE",
url: "{{ route('admin.restaurants.store') }}"+'/'+restaurant_id,
success: function (data) {
table.draw();
html = '<div class="alert alert-danger alert-dismissible fade show" role="alert"><strong><i class="fas fa-trash"></i> ' + data.success + '</strong><button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">×</span></button></div>';
$('#form_result').html(html);
},
error: function (data) {
console.log('Error:', data);
}
});
});
});
</script>
ISSUE
I’m keep getting same issue in my Network console
and it is
Call to a member function getClientOriginalName() on null
What I’m doing wrong here?
I also included @crsf in form and enctype="multipart/form-data"
.
And I’m also using Laravel Intervention Image.
Please help.
2
Answers
You can not pass
enctype
andmimetype
in ajax function. Please try thisThe error message means that ‘logo’ is not in the request.
When you try to get it with
it is probably
null
. When you then try to get the filenameit fails because
$logo=null
.Try to use
to see what is actually in the request. Or you can log it with