0

让我的视图更新放置事件时遇到了一些麻烦。我很确定问题出在函数 handleDrop() 中。视图的重新渲染在浏览器中的普通 model.set({}) 测试中起作用。所以，我知道这不是问题所在......

骨干路由器

App.Routers.Dashboard = Backbone.Router.extend({

routes: {
    "": "index"     
},

initialize: function(options) {

    },

index: function() {

var preflist = new App.Models.PrefList({});

preflist.fetch({
    success: function() {
      var paneloneview = new App.Views.PanelOne({ model: preflist });
      $('#panelone').html(paneloneview.render().$el);
    }  
});

var sourceID;
var payloads = {
poolpricedraggable: "poolprice",
nonedraggable: "smp"
};

var element = function(id) { return document.getElementById(id); }

function handleDragOver(event) {
if(event.preventDefault) event.preventDefault();
return false;
}
function handleDrop(event) {
    dropzone = this.id;
    if(event.preventDefault) event.preventDefault();
    console.log("recevied the data: " + payloads[sourceID] + " in #" + dropzone);
    var attribute = preflist.get('panel_one');
    preflist.set({panel_one: attribute});
    preflist.save();
}  

element('panelone').addEventListener('dragover', handleDragOver, false);            
element('panelone').addEventListener('drop', handleDrop, false);

PanelOne 视图

App.Views.PanelOne = Backbone.View.extend({

initialize: function() {                
    _.bindAll(this, 'render');
    this.model.bind('change', this.render);
},

render: function(){
    var panelonesetting = this.model.get('panel_one');
    this.$el.html(JST['dashboard/' + panelonesetting]({}));
return this;
}

});

最诚挚的问候，交流

4

2 回答 2

0

我上面问题中的代码是在深夜写的。现在，我醒了，看到汤姆和穆指出我犯的尴尬错误（这感觉类似于醉酒拨号事件）。尽管如此，这里有一段更正的代码，所有这些对于任何拥有主干应用程序的人来说都应该很方便，他们想要包含一些拖放功能来设置模型属性：

    function handleDrop(event) {
       //  This dropzone var isn't used for anything here but may be useful for others. So, I've left it in...
       dropzone = this.id;
       // This preventDefault is necessary to prevent actions some older browsers like to do on drop events
       if(event.preventDefault) event.preventDefault();
       //  This model attribute should be set to the payload listed above
   preflist.set({ panel_one: payloads[sourceID] });
   preflist.save();
        }
于 2012-12-16T17:06:10.643 回答
0

我在这里可以看到的一个问题是，您正在尝试使用与自身相同的值来设置模型的值 - 当您用自身替换值并且模型中的更改没有被检测到时，它基本上会被忽略 - 因此渲染方法没有被调用。

您可能希望使用模型trigger上的方法自己手动调用模型上的渲染或触发更改事件。（如果在您提供的代码之外还有其他事情发生 - 因为我在这里可以看到什么都不会改变？）

您是否忘记使用来自拖动对象的信息来更改模型的设置？

于 2012-12-16T10:29:00.383 回答