bhavuksuthar's avatar

Pass CSRF Token with Fileinput plugin on delete url

Hi Everyone

I am trying to use the Bootstrap File Input Plugin and upload and edit work fine.

I am having trouble setting up the deleteUrl option for the plugin.

When I click on the file delete icon I get unknown status error. The problem seems to be with CSRFToken so I have tried following solutions but none of them is working.


//Attempt 1
$("#file-input").fileinput({
    deleteUrl: "{{ route('admin.members.deleteFile', ['user' => $user->id]) }}",   
    ajaxSettings:{
        beforeSend: function(xhr, settings) {
                        xhr.setRequestHeader("X-CSRFToken", $('meta[name="csrf-token"]').attr('content'));
                }
         },
});

//Attempt 2
$("#file-input").fileinput({
    deleteUrl: "{{ route('admin.members.deleteFile', ['user' => $user->id]) }}",
        headers: {
             'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
       },
});

//Attempt 3
$("#file-input").fileinput({
    deleteUrl: "{{ route('admin.members.deleteFile', ['user' => $user->id]) }}",
    uploadExtraData:{'_token':$('#csrf_token').val()
});

None of the above workes. I get the same error.

Thank you

0 likes
3 replies
spyworld's avatar

unknown status usually is no response. Javascript is non-blocking I/O.

Try to create log to debug your CSRFToken filtering.

bhavuksuthar's avatar

Thank you for your reply. I just figured it out. The plugin has separate settings for deleteUrl which is ajaxDeleteSettings.

rcc's avatar

@bhavuksuthar can the part of source code here? I am facing the same issue. Thanks.

1 like

Please or to participate in this conversation.