In ember, how do I pass view data from a drag into a drop?
I'm using ember latest and jquery.ui's Draggable and Droppable. I am also using some mixins that a talented ember person created to make a Draggable and Droppable view in ember. Here's the fiddle:
http://jsfiddle.net/inconduit/6n49N/7/
I need to attach the view's content to the drag event so that I can access it in the drop event. With straight up jquery, I know you'd do $(..).draggable({ .. }).data("myData","some data here"); but I don't know how to reference the view's content in this ember implementation.
Here's a snippet from App.Draggable in the fiddle:
App.Draggable = JQ.Draggable.extend({
appendTo: 'body',
helper: function() {
$(this).data("myData","this is where actual data would go");
JQ.Draggable extends Ember.View. Inside the helper() function, 'this' refers to the actual DOM element, I don't know how to refer to the View's variables. I want to pass the view's content so that it can be retrieved here:
App.Droppable = JQ.Droppable.extend({
drop: function(event,ui) {
alert('Dropped! ' + $(ui.draggable).data("myData"));
The template for the draggable looks like this:
{{#view App.Draggable contentBinding="App.anObject"}}Drag me{{/view}}
and I would like to pass that content. Please have a look at the fiddle, the pertinent functions are defined at the bottom of the javascript.
answering my own question here.
i attached the data in the didInsertElement callback as follows:
App.DraggableDataView = App.Draggable.extend({
didInsertElement: function() {
this._super();
var element = this.get('element');
$(element).data('myData',this.get('content'));
},
});