Drag and Drop ②

Dojo 0.2.2 で Drag and Drop する。(WebWork2.2.1を使用している)

dojo.provide("dojo.dnd.TableHtmlDropTarget");
dojo.require("dojo.dnd.HtmlDropTarget");
dojo.require("dojo.lang");

dojo.dnd.TableHtmlDropTarget = function(node, types){
    this.domNode = node;
    dojo.dnd.DropTarget.call(this);
    this.acceptedTypes = types||[];
}

dj_inherits(dojo.dnd.TableHtmlDropTarget,  dojo.dnd.HtmlDropTarget);

dojo.lang.extend(dojo.dnd.TableHtmlDropTarget, {
    onDragOver: function(e) {
        if (!dojo.lang.inArray(this.acceptedTypes, "*")) { // wildcard
            for (var i = 0; i < e.dragObjects.length; i++) {
                if (!dojo.lang.inArray(this.acceptedTypes, e.dragObjects[i].type)) {
                    return false;
                }
            }
        }
        return true;
    },
    onDragMove: function(e) {},
    onDragOut: function (e) {},
    onDrop: function(e) { return
      // Drag and Drop にて持ってきたオブジェクトを指定の場所に配置する処理を書く
      // e.originalTarget で持ってきたオブジェクトが取得できる
      // 追記 e.dropTarget がDorp先のオブジェクト
    }
});

dojo.require("dojo.event.*");
dojo.require("dojo.dnd.*");

// 下記でDrag and Dropで配置可能な場所を設定する
// 複数指定も可能のようです
new dojo.dnd.HtmlDragSource(配置可能な場所のElement, "worker");

// 下記でDrag and Dropする対象のタグを指定する
// 複数指定も可能のようです
new dojo.dnd.TableHtmlDropTarget(対象のElement, ["worker"]);

// 上記 worker は type の指定。ので DragSource, DropTargetともに同じ値を指定する
// ようです。

とりあえずこんな感じでうごくはず。

※、TableHtmlDropTargetは試した時に、Tableを使ってたからTableの名前をつけただけです。