0
votes

Using Laravel 5.4 I'm trying to submit a form with a file to upload with ajax.

My jquery code:

$("#uploadRoastsForm").submit(function() {
var url = $(this).attr('action');
var fd = new FormData();    
var files = $('#roastFile')[0].files;    

if(files.length > 0)
    fd.append('file', files[0]);

fd.append('file', files[0]);
fd.append('roast_date', $('#roastDate').val());
    
$.ajax({
    url: url,
    type: 'POST',
    data: fd,
    contentType: false,
    processData: false,
    success: function (data) {...

My form:

<form action="/warehouse/upload" method="post" enctype="multipart/form-data" class="form" id="uploadRoastsForm">
                {{ csrf_field() }}
                
                <div class="form-group" style="width:150px">
                    <label>Roasting Date</label>
                    <div class="input-group">
                        <input name="roast_date" type="text" value="{{ old('roast_date') }}" class="form-control datepick" id="roastDate">
                        <div class="input-group-addon">
                            <span class="fa fa-calendar"></span>
                        </div>
                    </div>    
                </div>

                <div class="form-group">
                    <label>Upload Roast Files</label>
                    <input type="file" name="file" id="roastFile">
                </div>

I am getting this in firebug: XHRPOSThttp://highland.local/warehouse/upload [HTTP/1.1 419 unknown status 250ms]

message ""
exception   
file    "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Foundation\\Exceptions\\Handler.php"
line    204
trace   [ {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, … ]
0   Object { file: "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Foundation\\Exceptions\\Handler.php", line: 176, function: "prepareException", … }
file    "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Foundation\\Exceptions\\Handler.php"
line    176
function    "prepareException"
class   "Illuminate\\Foundation\\Exceptions\\Handler"
type    "->"
1   Object { file: "C:\\wamp64\\www\\highland.local\\app\\Exceptions\\Handler.php", line: 77, function: "render", … }
file    "C:\\wamp64\\www\\highland.local\\app\\Exceptions\\Handler.php"
line    77
function    "render"
class   "Illuminate\\Foundation\\Exceptions\\Handler"
type    "->"
2   Object { file: "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Pipeline.php", line: 83, function: "render", … }
file    "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Pipeline.php"
line    83
function    "render"
class   "App\\Exceptions\\Handler"
type    "->"
3   Object { file: "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Pipeline.php", line: 55, function: "handleException", … }
file    "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Pipeline.php"
line    55
function    "handleException"
class   "Illuminate\\Routing\\Pipeline"
type    "->"
4   Object { file: "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\View\\Middleware\\ShareErrorsFromSession.php", line: 49, function: "Illuminate\\Routing\\{closure}", … }
file    "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\View\\Middleware\\ShareErrorsFromSession.php"
line    49
function    "Illuminate\\Routing\\{closure}"
class   "Illuminate\\Routing\\Pipeline"
type    "->"
5   Object { file: "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Pipeline\\Pipeline.php", line: 163, function: "handle", … }
file    "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Pipeline\\Pipeline.php"
line    163
function    "handle"
class   "Illuminate\\View\\Middleware\\ShareErrorsFromSession"
type    "->"
6   Object { file: "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Pipeline.php", line: 53, function: "Illuminate\\Pipeline\\{closure}", … }
file    "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Pipeline.php"
line    53
function    "Illuminate\\Pipeline\\{closure}"
class   "Illuminate\\Pipeline\\Pipeline"
type    "->"
7   Object { file: "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Session\\Middleware\\StartSession.php", line: 63, function: "Illuminate\\Routing\\{closure}", … }
file    "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Session\\Middleware\\StartSession.php"
line    63
function    "Illuminate\\Routing\\{closure}"
class   "Illuminate\\Routing\\Pipeline"
type    "->"
8   Object { file: "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Pipeline\\Pipeline.php", line: 163, function: "handle", … }
file    "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Pipeline\\Pipeline.php"
line    163
function    "handle"
class   "Illuminate\\Session\\Middleware\\StartSession"
type    "->"
9   Object { file: "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Pipeline.php", line: 53, function: "Illuminate\\Pipeline\\{closure}", … }
file    "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Pipeline.php"
line    53
function    "Illuminate\\Pipeline\\{closure}"
class   "Illuminate\\Pipeline\\Pipeline"
type    "->"
10  Object { file: "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Cookie\\Middleware\\AddQueuedCookiesToResponse.php", line: 37, function: "Illuminate\\Routing\\{closure}", … }
file    "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Cookie\\Middleware\\AddQueuedCookiesToResponse.php"
line    37
function    "Illuminate\\Routing\\{closure}"
class   "Illuminate\\Routing\\Pipeline"
type    "->"
11  Object { file: "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Pipeline\\Pipeline.php", line: 163, function: "handle", … }
file    "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Pipeline\\Pipeline.php"
line    163
function    "handle"
class   "Illuminate\\Cookie\\Middleware\\AddQueuedCookiesToResponse"
type    "->"
12  Object { file: "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Pipeline.php", line: 53, function: "Illuminate\\Pipeline\\{closure}", … }
file    "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Pipeline.php"
line    53
function    "Illuminate\\Pipeline\\{closure}"
class   "Illuminate\\Pipeline\\Pipeline"
type    "->"
13  Object { file: "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Cookie\\Middleware\\EncryptCookies.php", line: 66, function: "Illuminate\\Routing\\{closure}", … }
file    "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Cookie\\Middleware\\EncryptCookies.php"
line    66
function    "Illuminate\\Routing\\{closure}"
class   "Illuminate\\Routing\\Pipeline"
type    "->"
14  Object { file: "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Pipeline\\Pipeline.php", line: 163, function: "handle", … }
file    "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Pipeline\\Pipeline.php"
line    163
function    "handle"
class   "Illuminate\\Cookie\\Middleware\\EncryptCookies"
type    "->"
15  Object { file: "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Pipeline.php", line: 53, function: "Illuminate\\Pipeline\\{closure}", … }
file    "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Pipeline.php"
line    53
function    "Illuminate\\Pipeline\\{closure}"
class   "Illuminate\\Pipeline\\Pipeline"
type    "->"
16  Object { file: "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Pipeline\\Pipeline.php", line: 104, function: "Illuminate\\Routing\\{closure}", … }
file    "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Pipeline\\Pipeline.php"
line    104
function    "Illuminate\\Routing\\{closure}"
class   "Illuminate\\Routing\\Pipeline"
type    "->"
17  Object { file: "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Router.php", line: 684, function: "then", … }
file    "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Router.php"
line    684
function    "then"
class   "Illuminate\\Pipeline\\Pipeline"
type    "->"
18  Object { file: "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Router.php", line: 659, function: "runRouteWithinStack", … }
file    "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Router.php"
line    659
function    "runRouteWithinStack"
class   "Illuminate\\Routing\\Router"
type    "->"
19  Object { file: "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Router.php", line: 625, function: "runRoute", … }
file    "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Router.php"
line    625
function    "runRoute"
class   "Illuminate\\Routing\\Router"
type    "->"
20  Object { file: "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Router.php", line: 614, function: "dispatchToRoute", … }
file    "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Router.php"
line    614
function    "dispatchToRoute"
class   "Illuminate\\Routing\\Router"
type    "->"
21  Object { file: "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Foundation\\Http\\Kernel.php", line: 176, function: "dispatch", … }
file    "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Foundation\\Http\\Kernel.php"
line    176
function    "dispatch"
class   "Illuminate\\Routing\\Router"
type    "->"
22  Object { file: "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Pipeline.php", line: 30, function: "Illuminate\\Foundation\\Http\\{closure}", … }
file    "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Pipeline.php"
line    30
function    "Illuminate\\Foundation\\Http\\{closure}"
class   "Illuminate\\Foundation\\Http\\Kernel"
type    "->"
23  Object { file: "C:\\wamp64\\www\\highland.local\\app\\Http\\Middleware\\ForceSsl.php", line: 29, function: "Illuminate\\Routing\\{closure}", … }
file    "C:\\wamp64\\www\\highland.local\\app\\Http\\Middleware\\ForceSsl.php"
line    29
function    "Illuminate\\Routing\\{closure}"
class   "Illuminate\\Routing\\Pipeline"
type    "->"
24  Object { file: "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Pipeline\\Pipeline.php", line: 163, function: "handle", … }
file    "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Pipeline\\Pipeline.php"
line    163
function    "handle"
class   "App\\Http\\Middleware\\ForceSsl"
type    "->"
25  Object { file: "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Pipeline.php", line: 53, function: "Illuminate\\Pipeline\\{closure}", … }
file    "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Pipeline.php"
line    53
function    "Illuminate\\Pipeline\\{closure}"
class   "Illuminate\\Pipeline\\Pipeline"
type    "->"
26  Object { file: "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Foundation\\Http\\Middleware\\TransformsRequest.php", line: 31, function: "Illuminate\\Routing\\{closure}", … }
file    "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Foundation\\Http\\Middleware\\TransformsRequest.php"
line    31
function    "Illuminate\\Routing\\{closure}"
class   "Illuminate\\Routing\\Pipeline"
type    "->"
27  Object { file: "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Pipeline\\Pipeline.php", line: 163, function: "handle", … }
file    "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Pipeline\\Pipeline.php"
line    163
function    "handle"
class   "Illuminate\\Foundation\\Http\\Middleware\\TransformsRequest"
type    "->"
28  Object { file: "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Pipeline.php", line: 53, function: "Illuminate\\Pipeline\\{closure}", … }
file    "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Pipeline.php"
line    53
function    "Illuminate\\Pipeline\\{closure}"
class   "Illuminate\\Pipeline\\Pipeline"
type    "->"
29  Object { file: "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Foundation\\Http\\Middleware\\TransformsRequest.php", line: 31, function: "Illuminate\\Routing\\{closure}", … }
file    "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Foundation\\Http\\Middleware\\TransformsRequest.php"
line    31
function    "Illuminate\\Routing\\{closure}"
class   "Illuminate\\Routing\\Pipeline"
type    "->"
30  Object { file: "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Pipeline\\Pipeline.php", line: 163, function: "handle", … }
file    "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Pipeline\\Pipeline.php"
line    163
function    "handle"
class   "Illuminate\\Foundation\\Http\\Middleware\\TransformsRequest"
type    "->"
31  Object { file: "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Pipeline.php", line: 53, function: "Illuminate\\Pipeline\\{closure}", … }
file    "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Pipeline.php"
line    53
function    "Illuminate\\Pipeline\\{closure}"
class   "Illuminate\\Pipeline\\Pipeline"
type    "->"
32  Object { file: "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Foundation\\Http\\Middleware\\ValidatePostSize.php", line: 27, function: "Illuminate\\Routing\\{closure}", … }
file    "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Foundation\\Http\\Middleware\\ValidatePostSize.php"
line    27
function    "Illuminate\\Routing\\{closure}"
class   "Illuminate\\Routing\\Pipeline"
type    "->"
33  Object { file: "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Pipeline\\Pipeline.php", line: 163, function: "handle", … }
file    "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Pipeline\\Pipeline.php"
line    163
function    "handle"
class   "Illuminate\\Foundation\\Http\\Middleware\\ValidatePostSize"
type    "->"
34  Object { file: "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Pipeline.php", line: 53, function: "Illuminate\\Pipeline\\{closure}", … }
file    "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Pipeline.php"
line    53
function    "Illuminate\\Pipeline\\{closure}"
class   "Illuminate\\Pipeline\\Pipeline"
type    "->"
35  Object { file: "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Pipeline\\Pipeline.php", line: 104, function: "Illuminate\\Routing\\{closure}", … }
file    "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Pipeline\\Pipeline.php"
line    104
function    "Illuminate\\Routing\\{closure}"
class   "Illuminate\\Routing\\Pipeline"
type    "->"
36  Object { file: "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Foundation\\Http\\Kernel.php", line: 151, function: "then", … }
file    "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Foundation\\Http\\Kernel.php"
line    151
function    "then"
class   "Illuminate\\Pipeline\\Pipeline"
type    "->"
37  Object { file: "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Foundation\\Http\\Kernel.php", line: 116, function: "sendRequestThroughRouter", … }
file    "C:\\wamp64\\www\\highland.local\\vendor\\laravel\\framework\\src\\Illuminate\\Foundation\\Http\\Kernel.php"
line    116
function    "sendRequestThroughRouter"
class   "Illuminate\\Foundation\\Http\\Kernel"
type    "->"
38  Object { file: "C:\\wamp64\\www\\highland.local\\public\\index.php", line: 53, function: "handle", … }
file    "C:\\wamp64\\www\\highland.local\\public\\index.php"
line    53
function    "handle"
class   "Illuminate\\Foundation\\Http\\Kernel"
type    "->"

I also tried to have an input as a submit button on the form and when I click it I call the exact same ajax, but then I got the error: MethodNotAllowed.

Something breaks when I use: contentType: false, processData: false. But if I don't use them I can't send the file to the controller. Can anyone help please?

How do you upload file with ajax in Laravel?

1

1 Answers

0
votes

At first you didn't posted what is the method in your route/web.php for your ajax request.

If it is MethodNotAllowed related problem then probably your ajax request and route method is not same.

If you are trying to update something then use PUT method in your route like below

Route::put('/warehouse/upload', "WarehouseController@upload');

And if you are trying to insert data into database table then use POST method:

Route::post('/warehouse/upload', "WarehouseController@upload');

As you are using POST method from your jQuery AJAX function, then just use post method in your route.

I think it should solve your query.