2

KendoUI Image Browser をアプリケーションに追加しましたが、開くとブラウザ (アップロード、選択、削除、並べ替え、検索など) が表示されますが、[挿入またはキャンセル] ボタンが表示されません... または下部に「Web アドレス」と「ツールチップ」のビットが表示されますか。

画像ブラウザ全体が欲しい (エディタは使いたくない)。

どんな助けでも大歓迎です。

これの代わりに： ここに画像の説明を入力

私はこれを得る： ここに画像の説明を入力

これが私のコードです：

<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());
                    }
               // }
            });
        });
4

2 に答える 2

3

ImageBrowser は技術的にはエディタの外で使用できるようですが、公式にはサポートされていません。この問題に関する Telerik フォーラムのスレッドは次のとおりです。

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

最も注目すべき引用は次のとおりです。

通常の要素から画像ブラウザ ウィジェットを初期化できます。設定は、エディタ内で画像ブラウザを使用する場合と同じです。

http://docs.kendoui.c​​om/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 は 3 つのイベントを公開します

  • 変更 - ファイルがクリックされたとき
  • 適用 - ファイルがダブルクリックされたとき
  • error - リクエストが失敗したとき

change および apply イベントは、クリックされたファイルを公開しませんが、どの .k-tile 要素に k-state-selected クラスがあるかを確認することで確認できます。

ImageBrowser は、フォルダー ナビゲーションに関連するイベントを公開しません。ウィジェットの path() メソッドを使用して、現在の場所を取得または設定できます。

于 2014-04-30T00:57:51.407 に答える
1

change および apply イベントは、クリックされたファイルを公開しませんが、どの .k-tile 要素に k-state-selected クラスがあるかを確認することで確認できます。

k-state-selected クラスをチェックせずに、次のような方法で現在選択されているアイテムを取得することができます。

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

適用イベントについてはチェックしていません。

于 2015-01-06T10:19:22.077 に答える