1

私はemberlatestとjquery.uiのDraggableandDroppableを使用しています。また、才能のある残り火の人が残り火でドラッグ可能およびドロップ可能なビューを作成するために作成したいくつかのミックスインを使用しています。これがフィドルです:

http://jsfiddle.net/inconduit/6n49N/7/

ドロップイベントでアクセスできるように、ビューのコンテンツをドラッグイベントに添付する必要があります。まっすぐなjqueryを使用すると、$(..)。draggable({..})。data( "myData"、 "some data here");を実行することがわかります。しかし、このemberの実装でビューのコンテンツを参照する方法がわかりません。

これは、フィドルのApp.Draggableからのスニペットです。

  App.Draggable = JQ.Draggable.extend({
     appendTo: 'body',
     helper: function() {
          $(this).data("myData","this is where actual data would go");

JQ.DraggableはEmber.Viewを拡張します。helper()関数内で、「this」は実際のDOM要素を参照しますが、ビューの変数を参照する方法がわかりません。ビューのコンテンツを渡して、ここで取得できるようにします。

  App.Droppable = JQ.Droppable.extend({
      drop: function(event,ui) {
          alert('Dropped! ' + $(ui.draggable).data("myData"));

ドラッグ可能なテンプレートは次のようになります。

  {{#view App.Draggable contentBinding="App.anObject"}}Drag me{{/view}}

その内容をお伝えしたいと思います。フィドルをご覧ください。関連する関数はjavascriptの下部に定義されています。

4

1 に答える 1

1

ここで自分の質問に答えます。

次のように、didInsertElement コールバックにデータを添付しました。

App.DraggableDataView = App.Draggable.extend({
    didInsertElement: function() {
        this._super();
        var element = this.get('element');
        $(element).data('myData',this.get('content'));
    },
});
于 2012-10-04T14:38:38.300 に答える