jQuery文件上传以前上载的文件删除

时间:2013-12-29 22:36:23

标签: c# asp.net jquery-file-upload

环境:.NET 4.51 WebForms

当包含jQueryFileUpload的页面加载时,我想在服务器上列出用户的文件,并允许他们删除它们。我已经关注了其他帖子:

并提出以下代码,用删除按钮替换结果中的开始和取消按钮:

 <script>             
        jQuery(document).ready(function () {
            //Initialise plugins
            FormFileUpload.init();

            //Get the images previously uploaded by the user
            $.ajax({
                dataType: 'json',
                type: "GET",
                url: "http://localhost:4837/Handlers/JQueryFileUploadHandler.ashx",
            }).done(function (data) {
                console.log(data.files);
                $('#fileupload').fileupload('add', { files: data.files });

                //Remove the Start & Cancel replacing with delete
                $("button").remove(".btn.red.cancel");

                $("table .btn.blue.start").prop('value', 'Delete');
                $("table .btn.blue.start > span").html("Delete");
                $("table .btn.blue.start > i").removeClass("icon-upload");
                $("table .btn.blue.start > i").addClass("icon-trash");
                $("table .btn.blue.start").addClass("red");
                $("table .btn.blue.start.red").removeClass("blue");

                console.log('======');
                $("table .btn.red.start").each(function (index) {
                    var imgFileName = $(this).closest('tr').find('td:nth-child(2)').text();
                    imgFileName = imgFileName.trim();

                    $(this).attr("data-type", "POST");
                    $(this).attr("data-url", "http://localhost:4837/handlers/JQueryFileUploadHandler.ashx?file=" + imgFileName + "&_method=DELETE");
                    console.log(imgFileName);
                });
                console.log('======');
            });

        });


        //<button data-url="http://localhost:4837/handlers//JQueryFileUploadHandler.ashx?file=V3.png&amp;_method=DELETE" data-type="POST" class="btn red delete">
        //                          <i class="icon-trash"></i>
        //                          <span>Delete</span>
        //                      </button>                                               
        //<input type="checkbox" class="toggle" value="1" name="delete">

    </script>

但即使我为每个条目提供了看似有效的HTML:

<button class="btn start red" value="Delete" data-type="POST" data-url="http://localhost:4837/handlers/JQueryFileUploadHandler.ashx?file=V3.png&amp;_method=DELETE">
                          <i class="icon-trash"></i>
                          <span>Delete</span>
                      </button>

当我点击删除按钮时,提交的网址仅为:

http://localhost:4837/handlers/JQueryFileUploadHandler.ashx

我错过了文件 _method 请求参数。所以我的问题是:

a)我需要做些什么来修复我的解决方案,以便获得完整的URL - 要么 - b)有没有人有一个完全可行的解决方案,他们从服务器获取文件列表,显示每个文件的删除按钮,以便用户可以管理以前上传的文件?

0 个答案:

没有答案