jquery - blueimp Basicでアップロードが開始される前にアップロードを停止するためにキューからファイルを削除する方法は?

Question

これが事です、

Basic プラス UI またはBasicの jQuery UI に似たキャンセル ボタンが必要です。この質問はばかげているように見えるかもしれません。しかし、実際には、BlueimpがBasic plus UIまたはjQuery UIで使用しているテンプレートから、開始、削除、キャンセルボタンでアップロードおよびダウンロードされたファイルをリストするために混乱しました。

ここで編集1：使用するとエラーが発生する同様の構文を持つ小枝テンプレートで作業しているため、そのテンプレートを使用することはできません。

キューからファイルを削除し、アップロード開始前にアップロードを防止するコードが必要です。

_cancelHandler が jquery.fileupload-ui.js にあることを検索しましたが、混乱させている関数がたくさんあります。

誰か助けてください。

ドキュメンテーション（最小限のセットアップガイド）でプラグインの基本的な使用法を読んでも、キャンセルボタンを持つデータはありません。

ここで編集2：キューにあるすべてのファイルをアップロードするアップロードボタンが1つだけ必要であることを言い逃したと思います。リスト内のファイルがキャンセルされた場合、それはアップロードされません。

ここに私のコードがあります

$(function () {

    var cancel_btn = $('<button/>')
    .addClass('btn btn-warning cancel pull-right')
    .html('<i class="icon-ban-circle icon-white"></i><span> Cancel')
    .on('click', function () {
    var $this = $(this),
        data = $this.data();
        $(this).parents('tr').remove();

        alert("code to remove from the queue and to prevent upload before upload start");
    });

    var delete_btn = $('<button/>')
    .addClass('btn btn-danger cancel pull-right')
    .html('<i class="icon-ban-circle icon-white"></i><span> Delete')
    .on('click', function () {
        alert('code needed to delete file');
    });    

    $('#fileupload').fileupload({
        dataType: 'json',
        autoUpload: false,
        add: function (e, data) {

            console.log(data);
           // data.context = $('<div/>').appendTo('#files');
            $.each(data.files, function (index, file) {

                var tr = document.createElement('tr');
                var td1 = document.createElement('td');
                var td2 = document.createElement('td');
                var td3 = document.createElement('td');
                $(td1).append(file.name);
                $(td2).append(file.size);
                $(td3).append(cancel_btn.clone(true).data(data));
                $(tr).append(td1,td2,td3);
                $('#files_list tbody').append(tr);

                var size = $('#files_list tbody tr').size();
                if(size < 1 )
                    $('#files_list').addClass('hide');
                else
                    $('#files_list').removeClass('hide');
            });

            $('#submit').click(function (){
                //data.context = $('<p/>').text('Uploading...').replaceAll($(this));
                data.submit();
                $('#files_list tbody').html('');
            });
        },
        done: function (e, data) {

            $.each(data.result.files, function (index, file) {
                var tr = document.createElement('tr');
                var td1 = document.createElement('td');
                var td2 = document.createElement('td');
                var td3 = document.createElement('td');
                $(td1).append(file.name);
                $(td2).append(file.size);
                $(td3).append(delete_btn.clone(true).data(data));
                $(tr).append(td1,td2,td3);
                $('#files_list tbody').append(tr);
            });
        },
        fail: function (e, data) {
            //console.log(data.result);
            $.each(data.result.files, function (index, file) {
                var error = $('<span/>').text(file.error);
                $(data.context.children()[index])
                    .append('<br>')
                    .append(error);
            });
        },
        progressall: function (e, data) {
            var progress = parseInt(data.loaded / data.total * 100, 10);
            $('#progress .bar').css(
                'width',
                progress + '%'
            );
        }        
    });
});