Bootstrap file-input does not call the controller method in Laravel

Question

I am new to Laravel. I am using Bootstrap file-input plugin to upload multiple files in Laravel. But in my code, url in the uploadUrl is not called. That means ajax call is not sent to the laravel backend controller and controller method is not called. Could you please help me in resolving this issue? Thank you.

HTML CODE

<div class="form-group">
<label class="col-sm-2 control-label required">FEATURED IMAGES</label>
<div class="col-sm-10">
<input id="featured-file" name="featured-file[]" type="file" multiple class="file-loading">
<p class="notice">Please use to upload 550px width x 670px height images for better view</p>
</div>
</div>

jQuery Code

$("#featured-file").fileinput({  
        theme: 'fa',
        uploadAsync:true,
        uploadUrl:"{{ url('/news/uploadimgsaddmode') }}",
        uploadExtraData: function() {
           return {
              _token: '<?php echo csrf_token() ?>',
           };
        },            
        allowedFileExtensions: ['jpg', 'png', 'gif','jpeg'],
        overwriteInitial: false,
        maxFileSize:2000,
        maxFilesNum: 10
        }).on('fileuploaded', function(event, previewId, index, fileId) {
            console.log('File Uploaded', 'ID: ' + fileId + ', Thumb ID: ' + previewId);
        }).on('fileuploaderror', function(event, data, msg) {
            console.log('File Upload Error', 'ID: ' + data.fileId + ', Thumb ID: ' + data.previewId);
});

Laravel Controller Method

public function uploadimagesaddmode(Request $request){
        Session::put('uploaded_files','Hi');
        Session::save();
        return response()->json(['uploaded' =>'Hi']);
}

And I used some html code to test whether controller method is called or not

<p>@if(Session::has('uploaded_files')) {{ Session::get('uploaded_files') }} @endif</p>

If controller method is called Session values should be printed. But no value is printed.

Answer 1

I found a solution. Thanks for all who responded to my question :)

I edited the jQuery Code. Here's the edited one. It works for me.

$(document).on("ready", function() {
        $("#featured-file").fileinput({  
            theme: 'fa',
            allowedFileExtensions: ['jpg', 'png', 'gif','jpeg'],              
            uploadUrl: "{{ url('news/uploadimgsaddmode') }}", 
            uploadExtraData: function() {
                return {
                    _token: '<?php echo csrf_token() ?>',

                };
            },
            uploadAsync:true,           
            overwriteInitial: false,
            maxFileSize:2000,
            maxFilesNum: 10,                       
        }).on("filebatchselected", function(event, files) {
            $("#featured-file").fileinput("upload");
        });
    });