Laravel5 file Upload via Ajax

Question

When I am uploading file showing some error. Error details and file contents are given below. Could you please check and help me to solve this issue?

Error

 Whoops, looks like something went wrong.

 MethodNotAllowedHttpException in RouteCollection.php line 201:

 in RouteCollection.php line 201

at RouteCollection->methodNotAllowed(array('GET', 'HEAD')) in RouteCollection.php line 188

at RouteCollection->getRouteForMethods(object(Request), array('GET', 'HEAD')) in RouteCollection.php line 140

at RouteCollection->match(object(Request)) in Router.php line 746

at Router->findRoute(object(Request)) in Router.php line 655

at Router->dispatchToRoute(object(Request)) in Router.php line 631

at Router->dispatch(object(Request)) in Kernel.php line 236

etc

routes.php

Route::post('/ambition/update', [
    'before'  => 'csrf',
    'as'      => 'tagambitionupdate',
    'uses'    => 'TagambitionController@update'
]);

TagambitionController.php

public function update(TagambitionRequest $request)
    {
        $userTagID     = $request->hiddenid;
        $file          = $request->file('file');
        dd($file);
    } 

JS

 $(document).ready(function() {
        /* Upload files of ambition tags begin*/
        $("#submit").click(function(){
            alert('hai');
            var form      = $("#addForm")[0];
            var formdata  = new FormData(form);
            formdata.append('file', 'file');
            $.ajax({
                url : "/ambition/update",
                type: "POST",
                data : formdata,
                processData: false,
                contentType: false,
                success:function(data){
                    alert(data);
                }
            });
        });
        /* Upload files of ambition tags end*/
    });

forntend.blade.php

<div class="tag-handler-ambition-response">
                        <form id="addForm" method="post" enctype="multipart/form-data"><span id="tag-ambition-append">Test</span><input name="file" type="file" id="file" ><input name="hiddenid" id="hiddenid" type="hidden" value='{{ $id }}' ><input type="hidden" name="_token" value="{{ csrf_token() }}"><button class="btn btn-default" id="submit" >Submit</button></form>
                    </div>

Answer 1

Finally I got my result. I have changed the button click function to form submit. Please check my code below. I can upload files without refreshing page using Laravel5 and jQuery ajax.

jS

$("#addForm_"+response.id).submit(function(e){
                            e.preventDefault();
                            var form      = $("#addForm_"+response.id)[0];
                            var formdata  = new FormData(form);
                            formdata.append('file', 'file_'+response.id);
                            $.ajax({
                                url : "/ambition/update",
                                type: "POST",
                                data : formdata,
                                processData: false,
                                contentType: false,
                                success:function(data){
                                }
                            });
                            e.preventDefault();
                        });