私はrequirejsとバックボーンにアプリを持っています。要素をクリックすると、ドラッグ可能でサイズ変更可能なdivをページに追加し、要素をコレクションに挿入します。要素のサイズを変更またはドラッグすると、要素のデータを div や高さなどの新しい値でアップロードしたいと思います。可能です?
これは私の見解ですか?
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;
console.log('initialize DesignView');
this.collection = new DesignCollection();
var here = this;
$('#insert-dynamic-element').click(function(){
//json to the collection with data t update
var element = { name:'img', type:'image', width:'100px', height:'50px' };
here.collection.addElement(element);
here.render();
$(function() {
$('.drag-item').draggable({
snap : true,
cursor : "move",
delay : 100,
scroll : false,
containment : "parent"
}).resizable({
containment : "parent",
stop: function(e, ui) {
var width = ui.size.width;
var height = ui.size.height;
//I want update this value of width and height into the collection
}
});
});
});
},
render: function(){
var template = _.template(this.template, {elements:this.collection.toJSON()});
this.$el.empty();
this.$el.append(template);
}
})
return DesignView;
});