Backbone在POST后立即执行GET

时间:2011-06-07 05:52:26

标签: backbone.js

我是第一次使用backbone.js进行实验,我有一个非常简单的Grails应用程序,其中包含一个名为Book的域名。事情似乎运作良好但是,我注意到当我将数据从表单发布到服务器主干时,然后使用新记录的ID对服务器进行GET。但是,POST将结果作为JSON返回并相应地填充表。我不确定我是否理解POST后需要GET或如何阻止这种情况发生。

$(function() {

    // Model

    window.Book = Backbone.Model.extend({
                url: function() {
                    return this.id ? '/BackboneTest/books/' + this.id : '/BackboneTest/books.json';
                },

                defaults: { book: {
                    title: 'None entered',
                    description: 'None entered',
                    isbn: 'None entered'
                }},

                initialize: function() {
                    // can be used to initialize model attributes
                }

            });

    // Collection

    window.BookCollection = Backbone.Collection.extend({

                model: Book,
                url: '/BackboneTest/books.json'

            });

    window.Books = new BookCollection;

    //View

    window.BookView = Backbone.View.extend({

                tagName: 'tr',

                events: {
                    // can be used for handling events on the template
                },

                initialize: function() {

                    //this.render();

                },

                render: function() {
                    var book = this.model.toJSON();
                    //Template stuff
                    $(this.el).html(ich.book_template(book));
                    return this;
                }



            });

    // Application View

    window.AppView = Backbone.View.extend({

                el: $('#book_app'),

                events: {
                    "submit form":"createBook"
                },

                initialize: function() {
                    _.bindAll(this, 'addOne', 'addAll');

                    Books.bind('add', this.addOne);
                    Books.bind('refresh', this.addAll);
                    Books.bind('all', this.render);

                    Books.fetch();
                },

                addOne: function(book) {
                    var view = new BookView({model:book});
                    this.$('#book_table').append(view.render().el);
                },

                addAll: function() {
                    Books.each(this.addOne);
                },

                newAttributes: function(event) {
                    return { book: {
                        title: $('#title').val(),
                        description: $('#description').val(),
                        isbn: $('#isbn').val()
                    }  }
                },

                createBook: function(e) {
                    e.preventDefault();
                    var params = this.newAttributes(e);
                    Books.create(params)
                    //TODO clear form fields
                }
            });

    // Start the backbone app
    window.App = new AppView;
});

2 个答案:

答案 0 :(得分:1)

我已经确定这是服务器端的原因。由于为测试目的生成了一些脚手架代码,在保存时,还有一个额外的重定向导致302.这导致POST后的GET。一旦我清理了服务器端代码,我就会按预期获得POST。

答案 1 :(得分:0)

Backbone使用POST作为工厂(从服务器获取id):

  1. 有效负载请求{ title: 'None entered' }

  2. 回复{ id: 12, title: 'None entered' }

  3. GET成功后,您的代码似乎会触发POST操作。代码Books.bind('all', this.render)似乎与任何事情无关。它没有像add那样绑定,并且视图中没有这样的方法。