javascript - dropzone js 链接删除 url 与删除按钮

标签 javascript jquery dropzone.js

在 Dropzonejs 中,我正在创建删除按钮,然后将其附加到缩略图,如何使用 addRemoveLinks:true 将我从服务器直接获取的 url 链接到删除按钮,

//Write function if you need to add some event after files added
      myDropzone.on("addedfile", function(file) {
        console.log('Files Added using ---------->'+$attrs.apiCall);
      var _this=this;
        /* Maybe display some more file information on your page */
       var removeButton = Dropzone.createElement("<button data-dz-remove>-Remove file</button>");
        removeButton.addEventListener("click", function(e) {
        e.preventDefault();
        e.stopPropagation();
        _this.removeFile(file);
        });
        file.previewElement.appendChild(removeButton);
      });

最佳答案

您可以添加删除链接..在添加文件事件中,您可以在服务器响应中获取URL并在删除链接中设置它。

 myDropzone.on("addedfile", function (file) {
     var _this = this;

     /* Maybe display some more file information on your page */
        var removeButton = Dropzone.createElement("<button data-dz-remove " +
                        "class='del_thumbnail btn btn-default'><span class='glyphicon glyphicon-trash'></span></button>");

        removeButton.addEventListener("click", function (e) {
        e.preventDefault();
        e.stopPropagation();
        var server_file = $(file.previewTemplate).children('.server_file').text();
        // Do a post request and pass this path and use server-side language to delete the file
        //          $.post(server_file,{'X-CSRFToken': $cookies.csrftoken}, 'json');
        $http({
            method: 'POSt',
            url: server_file,
            headers: {
                   'X-CSRFToken': $cookies.csrftoken
            }
        });
         _this.removeFile(file);
         });
         file.previewElement.appendChild(removeButton);
 });

关于javascript - dropzone js 链接删除 url 与删除按钮,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24238193/

相关文章:

javascript - 制作一个服务器模块以便在 Node.js 中重用

javascript - 显示具有相同属性值的对象中的最新条目

javascript - 选择对象在 Chrome contentEditable 元素中表现异常

Jquery 一种更干净的前置方式

javascript - 带有切换的 jQuery 效果 .fadeTo()?

javascript - 给定网页上有多个页面的表格,如何从 Chrome 访问所有页面的数据?

javascript - ckeditor textarea 自定义与 jquery 拖放

javascript - 如何使用 Dropzone.js 禁用可点击的表单?

javascript - Dropzone JS-不接收选项

javascript - 如果 dropzone.js 中的图像不是 gif,则调整图像大小