0

私は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;
});
4

1 に答える 1