Asp.net mvc 剑道ui文件上传插件移除按钮自定义

我是剑道用户界面的新手，我正在asp.NETMVC应用程序中使用文件上传插件。一切工作都像梦一样。但我还有一个额外的要求。当我上传文件时，我给图像文件分配了一个唯一的图像guid，然后上传，然后返回回调函数

<script type="text/javascript">
    $(document).ready(function () {
        $("#attachments").kendoUpload({
            async: {
                saveUrl: '@Url.Action("UploadBlogImages", "Blog")',
                removeUrl: '@Url.Action("Remove", "Blog")',
                autoUpload: true
            },
            success: function (data) {
                var imageGuids = data.response;
                $.each(imageGuids, function (index, imageGuid) {
                    $('#form_uploadPic').append('<input type="hidden" value=' + imageGuid + 'name="ImgGuid">');
                });
            }
        });
    });
</script>

$（文档）.ready（函数（）{
$（“#附件”）.kendoUpload({
异步：{
saveUrl:'@Url.Action（“UploadBlogImages”，“Blog”），
removeUrl:'@Url.Action（“删除”、“博客”），
自动上载：true
},
成功：功能（数据）{
var imageGuids=data.response；
$.each（imageGuid、函数（索引、imageGuid）{
$（'#form_uploadPic'）。追加（''）；
});
}
});
});

当用户单击“删除”按钮时，我需要删除该文件，但我的问题是， 默认情况下，“删除”按钮会将文件名（上传时使用的）作为要删除的文件名 在上载到服务器之前重命名文件。我正在为文件分配唯一的guid。我已将该guid返回给成功函数。如何配置，以便“删除”按钮将该guid传递给服务器以删除文件

谢谢，

---

这是一个有趣的场景。现在有两种方法：

成功后，找到表示fileEntry的li元素，并获取其

fileNames

data-*属性。将检索到的

fileNames

对象的

name

属性设置为从服务器返回的guid值。这实质上更新了剑道上传控件的删除功能所使用的文件名。（如果你能找到原始源代码，寻找removeUploadedFile和_submitRemove的方法，所有这些都很有意义）

cleaner（稍微）选项是，在成功时，找到新添加的li元素（fileEntry），然后找到它关联的“Remove”按钮（类：k-upload-action）。有了remove按钮后，就可以连接一个click事件，通过该事件调用您自己的自定义url或upload控件的removeUrl，并将上载成功时检索到的文件guid传递给它

---

有趣的情景。现在有两种方法：

成功后，找到表示fileEntry的li元素，并获取其

fileNames

data-*属性。将检索到的

fileNames

对象的

name

属性设置为从服务器返回的guid值。这实质上更新了剑道上传控件的删除功能所使用的文件名。（如果你能找到原始源代码，寻找removeUploadedFile和_submitRemove的方法，所有这些都很有意义）

cleaner（稍微）选项是，在成功时，找到新添加的li元素（fileEntry），然后找到它关联的“Remove”按钮（类：k-upload-action）。有了remove按钮后，就可以连接一个click事件，通过该事件调用您自己的自定义url或upload控件的removeUrl，并将上载成功时检索到的文件guid传递给它

---

另一个选项是将id添加到文件对象本身，因此在onSuccess处理程序中添加以下内容：

function onUploadSuccess(e) {
    //add the id returned in the json from the upload server script
    e.files[0].id=e.response.id;
}

然后在移除处理程序中，将名称更改为id：

function onUploadRemove(e) {
    var files = e.files;
    for(i=0;i <files.length;i++){
            //replace the name with the id added to the object
        files[i].name=files[i].id;
    }
}

---

适用于最新的kendoUI

另一个选项是将id添加到文件对象本身，因此在onSuccess处理程序中添加以下内容：

function onUploadSuccess(e) {
    //add the id returned in the json from the upload server script
    e.files[0].id=e.response.id;
}

然后在移除处理程序中，将名称更改为id：

function onUploadRemove(e) {
    var files = e.files;
    for(i=0;i <files.length;i++){
            //replace the name with the id added to the object
        files[i].name=files[i].id;
    }
}

---

适用于最新的kendoUI

Hi Joel，但我无法将guid显示为文件名，因为它看起来不太好。是否有其他解决方法。感谢您的合作。更新

fileNames

数据属性的

name

属性不会影响显示的文件名。它位于li下的一个跨度内，但您永远不会操纵该元素的html。使用Firebug inspection进行一次尝试，你就会明白我在说什么。另一个推荐的扩展是FireQuery，它可以检查数据属性值。我的检查屏幕截图让您了解情况：嗨，Joel，但我无法将guid显示为文件名，因为它看起来不太好。是否有其他解决方法。感谢您的合作。更新

文件名

数据属性的

名称

属性不会影响显示的文件名。它位于li下的一个跨度内，但您永远不会操纵该元素的html。使用Firebug inspection进行一次尝试，你就会明白我在说什么。另一个推荐的扩展是FireQuery，它可以检查数据属性值。我的检查屏幕截图让您了解情况：