Question

我已将KendoUI图像浏览器添加到我的应用程序中，但是当它打开时，我会看到浏览器（上传，选择，删除，排序，搜索等），但没有得到“插入或取消”按钮。 ..我也不会在底部获得“网址”和“工具提示”位。

我想拥有整个图像浏览器（我不想使用编辑器）。

任何帮助都将不胜感激。

而不是： enter image description here

我明白了： enter image description here

这是我的代码：

<div id="imgBrowser"></div>

$(document).ready(function () {

            $("#imgBrowser").kendoImageBrowser({

                //imageBrowser: {
                    messages: {
                        dropFilesHere: "Drop files here"
                    },
                    transport: {
                        read: "/ImageBrowser/Read",
                        destroy: {
                            url: "/ImageBrowser/Destroy",
                            type: "POST"
                        },
                        create: {
                            url: "/ImageBrowser/Create",
                            type: "POST"
                        },
                        thumbnailUrl: "/ImageBrowser/Thumbnail",
                        uploadUrl: "/ImageBrowser/Upload",
                        imageUrl: "/ImageBrowser/Image?path={0}"
                    },
                    change: function () {
                        //this.value(); //Selected image URL
                        console.log(this.value());
                    }
               // }
            });
        });

Answer 1

看起来ImageBrowser可以技术上在编辑器之外使用，但它不受官方支持。以下是Telerik论坛上关于此问题的一个主题：

http://www.telerik.com/forums/why-not-make-image-browser-in-editor-as-separate-controle

以下是最引人注目的引用：

您可以从常规元素初始化图像浏览器小部件。配置与在编辑器中使用图像浏览器时的配置相同。

http://docs.kendoui.com/api/web/editor#imagebrowser-object

<div id="imgBrowser"></div>

$("#imgBrowser").kendoImageBrowser({
    transport: {
        read: "/service/ImageBrowser/Read",
        destroy: {
            url: "/service/ImageBrowser/Destroy",
            type: "POST"
        },
        create: {
            url: "/service/ImageBrowser/Create",
            type: "POST"
        },
        thumbnailUrl: "/service/ImageBrowser/Thumbnail",
        uploadUrl: "/service/ImageBrowser/Upload",
        imageUrl: "/service/ImageBrowser/Image?path={0}"
    }
});

ImageBrowser公开三个事件


更改 - 单击文件时

申请 - 双击文件时

错误 - 请求失败时


更改和应用事件不会公开单击的文件，但您可以通过检查哪个.k-tile元素具有k状态选择的类来找到它。

ImageBrowser不会公开与文件夹导航相关的事件。您可以使用窗口小部件的path（）方法获取或设置当前位置。

Answer 2

更改和应用事件不会公开单击的文件，但您可以通过检查哪个.k-tile元素具有k状态选择的类来找到它。

可以在不检查k-state选择的类的情况下获取当前所选项目，而不检查k-state选择的类：

        change: function(е) {
            var selectedImage = e.sender._selectedItem();
            console.log('selectedImage', selectedImage);
        }

我还没有检查申请活动。

KendoUI图像浏览器

2 个答案: