主干(同步)更新事件

Question

是我第二次问这个问题，在第一次文本混淆了理解，抱歉。下面是同样的问题的改进和最好的解释。

我有一个PageableCollection，数据加载没有问题!表的线条(我使用backgrid，扩展骨干)是可编辑的!!但是在编辑并按下回车键之后什么都没有发生!服务器没有被调用，我等待一些调用ajax的服务器，但它没有发生。

我找到了覆盖同步的方法，但我真的不知道我想做什么，在编辑后打电话，说"好"或"错误更新"。

代码如下:

var Territory = Backbone.Model.extend({});
var PageableTerritories = Backbone.PageableCollection.extend({
    model: Territory,
    url: "linhas/results",
    state: {
        pageSize: 9
    },
    mode: "client",
    sync: function (method, model, options){
        return Backbone.sync(method, model, options);
    }
});

var pageableTerritories = new PageableTerritories(),
    initialTerritories = pageableTerritories;
function createBackgrid(collection){
    var columns = [{
        name: "id", // The key of the model attribute
        label: "ID", // The name to display in the header
        editable: false, // By default every cell in a column is editable, but *ID* shouldn't be
        // Defines a cell type, and ID is displayed as an integer without the ',' separating 1000s.
        cell: Backgrid.IntegerCell.extend({
            orderSeparator: ''
        })
    }, {
        name: "name",
        label: "Name",
        // The cell type can be a reference of a Backgrid.Cell subclass, any Backgrid.Cell subclass instances like *id* above, or a string
        cell: "string" // This is converted to "StringCell" and a corresponding class in the Backgrid package namespace is looked up
    }, {
        name: "pop",
        label: "Population",
        cell: "integer" // An integer cell is a number cell that displays humanized integers
    }, {
        name: "url",
        label: "URL",
        cell: "uri" // Renders the value in an HTML <a> element
    }];
    if ($(window).width() < 768){
        //okendoken. removing URL-column for screens smaller than 768px
        columns.splice(3,1)
    }
    var pageableGrid = new Backgrid.Grid({
        columns: columns,
        collection: collection,
        footer: Backgrid.Extension.Paginator.extend({
            //okendoken. rewrite template to add pagination class to container
            template: _.template('<tr><td colspan="<%= colspan %>"><ul class="pagination"><% _.each(handles, function (handle) { %><li <% if (handle.className) { %>class="<%= handle.className %>"<% } %>><a href="#" <% if (handle.title) {%> title="<%= handle.title %>"<% } %>><%= handle.label %></a></li><% }); %></ul></td></tr>')
        }),
        className: 'table table-striped table-editable no-margin'
    });
    $("#table-dynamic").html(pageableGrid.render().$el);

}

Answer 1

您需要在编辑单元格后触发保存。这可以通过监听Territory模型的更改事件来完成。我一直在使用以下内容:

var MyModel = Backbone.Model.extend({
    initialize : function() {
        this.on('change', function(model, options) {
            // Prevent save on update
            if (options.save === false)
                return;
            model.save(_.clone(model.attributes), {});
        });
    },
    // Process and remove model unrelated stuff from server response
    parse : function(resp, options) {
        // pure model fetch
        if (!resp.data && !resp.notifications)
            return resp;
        // process notifications
        if (resp.notifications && resp.notifications.length)
            processNotifications(resp.notifications);
        return resp.data || {};
    },
    rollBack : function() {
        // Rollback to old data
        this.set(this.previousAttributes(), {save: false});
        // Trigger cell rendering
    },
    save : function(attrs, options) {
        options || (options = {});
        options.success = function(model, resp, options) {
            // Show optional success messages here if needed and
            // not in response from server
        };
        options.error = function(model, xhr, options) {
            var resp = JSON.parse(xhr.responseText);
            model.parse(resp, options);
            // Rollback to old data
            model.rollBack();
            model.trigger('backgrid:error');
        };
        // We get the correct data back from the server - prevent multiple saves
        options.save = false;
        options.data = JSON.stringify(attrs);
        Backbone.Model.prototype.save.call(this, attrs, options);
    }
});

此实现从服务器获取所有通知(如果成功则没有反馈)。因此，在模型中过滤通知。解析方法。如果有通知，则数据位于响应的属性数据中。然而，如果你显示来自js的反馈，在选项中实现它。Success and options.error