0

我是backbone.js 新手。我的 Rails 应用程序中有一个书签模型。我正在尝试创建一个文本字段，当我在其中输入文本并单击提交按钮时，它应该创建条目并将其显示在视图中，这样我就不需要刷新页面来查看新条目。

我编写了以下 Backbone.js 代码：

var BookmarksModel=Backbone.Model.extend({
    urlRoot: "/bookmarks",
})

 var enterBookmarkView = Backbone.View.extend({
        el: $("#divForBookmarks"),
        events: {
            "click #submit" : "submitBookmark"
        },
        initialize: function(){

        this.model.bind('change',this.render)
        this.render();
        },
        render: function(){
            alert("Render Called!");
            var temp = _.template( $("#enterBookmark").html(), {} );
            $(this.el).html(temp);
            return this;
        },
        submitBookmark : function(){
            var BM={
                url: $("#bookmark").val(),
                tag_list: $("#tags").val()
            }
            this.model.save(BM);
            this.render();
        }
    });

var mymodel=new BookmarksModel();
var enter_bookmark_view = new enterBookmarkView({ model: mymodel });

但是，这确实会创建新条目，但不会立即显示，我需要刷新页面才能看到新条目。我在模型的更改事件上调用渲染函数，所以这应该可以工作，对吧？另外，我在函数 submitBookmark 中调用了它，以便在调用该函数时它至少重新呈现，但这也不起作用。另外，这是通过视图在我们的模型中创建新条目的标准方式吗？

4

2 回答 2

0

您可能想要尝试的一件事是使用console.log()调试器或单步执行调试器，以确保this每次引用它时它都具有您期望的值。

如果您发现它this在某处有意外的值，请查看 Underscore.js 的bind()：http ://underscorejs.org/#bind 。

于 2012-12-16T14:48:33.433 回答
0

我认为您的绑定事件后缺少分号。此外，在您的骨干模型的扩展中，该对象的逗号太多。这将在 Internet Explorer 中崩溃。

这是您的代码的更新：

 var BookmarksModel=Backbone.Model.extend({
     urlRoot: "/bookmarks"
 })

 var enterBookmarkView = Backbone.View.extend({
        el: $("#divForBookmarks"),
        events: {
            "click #submit" : "submitBookmark"
        },
        initialize: function(){

    this.model.bind('change', this.render);
    this.render();
    },
    render: function(){
        alert("Render Called!");
        var temp = _.template( $("#enterBookmark").html(), {} );
        $(this.el).html(temp);
        return this;
    },
    submitBookmark : function(){
        var BM={
            url: $("#bookmark").val(),
            tag_list: $("#tags").val()
        }
        this.model.save(BM);
    }
});

var mymodel=new BookmarksModel();
var enter_bookmark_view = new enterBookmarkView({ model: mymodel });
于 2012-12-16T14:58:25.753 回答