0

我是 Backbone 的新手，我正在尝试从教程中获取要提交的表单。

我不断收到以下错误：

未捕获的类型错误：无法调用未定义的方法“添加”

为线this.collection.add( book );

我需要纠正什么？

JavaScript：

App.Views.AddBook = Backbone.View.extend({
    events: {
        'click #add': 'submit'
    },
    submit: function(e) {
        e.preventDefault();

        var formData = {};

        $('#addBook div').children('input').each(function(i, el) {
            if($(el).val() !== '') {
                formData[ el.id ] = $(el).val();
            }
        });

        var book = new App.Models.Book( formData );

        this.collection.add(book);
    }
});

var booksCollection = new App.Collections.Books([
    {
        title: 'JS: The Good Parts',
        author: 'Douglas Crockford',
        releaseDate: '2008'
    },
    {
        title: 'The Little Book on CoffeeScript',
        author: 'Alex MacCaw',
        releaseDate: '2012'
    }
]);

var addBook = new App.Views.AddBook({ el: $('#addBook') });

HTML：

<form id="addBook" action="#">
    <div>
        <label for="title">Title: </label><input id="title" type="text" />
        <label for="author">Author: </label><input id="author" type="text" />
        <label for="releaseDate">Release date: </label><input id="releaseDate" type="text" />
        <br>
        <button class="btn" id="add">Add</button>
    </div>
</form>
4

1 回答 1

3

您需要将您的视图传递booksCollection给您的视图，如下所示：

var addBook = new App.Views.AddBook({ 
    collection: booksCollection,
    el: $('#addBook') 
});

如果您不这样做，则不会this.collection在视图上下文中定义这就是您收到该错误的原因。视图初始化中的collection参数是特殊的，因为 Backbone 会将其分配给this.collection视图内部。

于 2013-06-17T19:34:44.830 回答