バックボーンにアプリがあり、いくつかのボタンを使用して動的にドラッグ可能でサイズ変更可能な要素を追加できます。この要素はモデルのコレクションに追加されます。たとえばドラッグを停止すると、要素の新しい座標が設定されますが、alays はLASTを設定しますドラッグした要素ではありません。どうすれば解決できますか?これは私のアプリビューです
define(['jquery' ,
'backbone',
'jquery_ui',
'models/design',
'collections/design',
'views/element',
"text!templates/design.html"
],
function($, Backbone, jQueryUI, DesignModel, DesignCollection, ElementView, tmplDesign){
var DesignView = Backbone.View.extend({
initialize: function(){
this.$el = $('#layout');
this.template = tmplDesign;
this.elementModel = null;
this.collection = new DesignCollection();
var here = this;
$('#insert-dynamic-element').click(function(){
var element = { designId:here.collection.models.length , name:'img', type:'image', width:'100px', height:'50px', top:'0', left:'0'};
here.elementModel = new DesignModel(element);
here.collection.addElement(here.elementModel);
here.render();
$(function() {
$('.drag-item').draggable({
snap : true,
cursor : "move",
delay : 100,
scroll : false,
containment : "parent",
stop: function (e, ui){
here.elementModel.set({ left:$(this).css('left'), top: $(this).css('top')});
here.collection.set(here.elementModel, {remove:false});
//--------------- HERE I WANT TO SET THE RIGHT ELEMENT DRAGGED NOT THE LAST!!! ------------------------------
}
});
});
});
},
render: function(){
var template = _.template(this.template, {elements:this.collection.toJSON()});
this.$el.empty();
this.$el.html(template);
}
})
return DesignView;
});