Clear Bootstrap File Input plugin using jquery?

Question

I am using krajee-file-input-plugin.I want to clear selected file based of file type.I have tried the following code but no result.

 @Html.TextBoxFor(m => m.PhotoUrl,
                class = "form-control imgUpload", @placeholder = "Please upload Photo",
                @id = "txtPhoto", @type = "file" })

 //fileUpload plugin
$(".imgUpload").fileinput({
    showUpload: false
});


 $(".imgUpload").change(function () {
    var ext = $(this).val().split('.').pop().toLowerCase();
    switch (ext) {
        case 'jpg':
        case 'jpeg':
        case 'png':
        case 'gif':                
            break;
        default:
            $(this).remove();
            alert('This is not an allowed file type.');

    }
});

Here $(this).remove() function is not working properly

Answer 1

Solved the above scenario by the below piece of code.

Hope it may help some one :)

$('.imgUpload').on('fileloaded', function (event, previewId) {
    var id = $(this).attr("id");
    var ext = $(this).val().split('.').pop().toLowerCase();
        if (ext == 'jpg' || ext == 'jpeg' || ext == 'png' || ext == 'gif') {
            return true
        }
        else {
            bootbox.alert("You can upload only files of type <strong>jpg ,jpeg ,png ,gif </strong>", function () {
                $("#"+id).fileinput('clear');
            });

        }
});