0

剣道グリッドを数行で埋めていて、グリッドと他の html コンポーネントの間でドラッグ アンド ドロップ機能を実装したいと考えています。

あるグリッドから別のグリッドへも、グリッド内で行をドラッグ/ドロップ/ソートする方法を示す多くのリソースを見つけることができますが、グリッドの外側から別のコンポーネントへは実際には何もありません。

kendo ui-grid はこれをサポートしていますか?

私が考えることができる1つの方法は、グリッド全体をドラッグ可能にし、ドラッグ開始時に現在選択されている行データを取得し、それをドロップ時に使用することです。しかし、それは実際にはあまりきれいな方法ではありません。この場合、カスタム ドラッグ イメージを作成する必要さえあります。

他の提案はありますか？

4

1 に答える 1

2

kendoDropTarget() メソッドを使用して、別の html 要素をターゲットとして割り当てることができます。たとえば、グリッドと HTML テキストエリアは次のとおりです。

<div id="grid"></div>
<textarea id="dropHere" rows="3" cols="50"></textarea>

$("#grid table tbody > tr").kendoDraggable({
    group: "gridGroup",
    threshold: 100,
    hint: function(e) {
        return $('<div class="k-grid k-widget"><table><tbody><tr>' + e.html() + '</tr></tbody></table></div>');
    }
});

$("#dropHere").kendoDropTarget({
    group: "gridGroup",
    drop: function(e) { 
        e.draggable.hint.hide();

        var txt = '';
        $(e.draggable.element[0]).find("td").each(function(idx, td){
          txt += $(td).text() + '\n';
        });
        e.dropTarget.text(txt);
    }
});

デモ

于 2015-10-26T21:10:51.943 に答える