0
我正在学习Backbone.js并使用BackGrid呈现数据并为最终用户提供了一种在Microsoft MVC网站上编辑记录的方法。为了这个测试网格的目的，我使用了一个供应商模型。 BackGrid默认可以编辑数据（这对我的目的是有好处的）。我已将以下JavaScript添加到我的视图中。只保存BackGrid网格上已更改的记录？
var Vendor = Backbone.Model.extend({
initialize: function() {
Backbone.Model.prototype.initialize.apply(this, arguments);
this.on("change", function (model, options) {
if (options && options.save === false) return;
model.url = "/Vendor/BackGridSave";
model.save();
});
}
});
var PageableVendors = Backbone.PageableCollection.extend(
{
model: Vendor,
url: "/Vendor/IndexJson",
state: {
pageSize: 3
},
mode: "client" // page entirely on the client side.
});
var pageableVendors = new PageableVendors();
//{ data: "ID" },
//{ data: "ClientID" },
//{ data: "CarrierID" },
//{ data: "Number" },
//{ data: "Name" },
//{ data: "IsActive" }
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: "ClientID",
label: "ClientID",
cell: "integer" // An integer cell is a number cell that displays humanized integers
}, {
name: "CarrierID",
label: "CarrierID",
cell: "number" // A cell type for floating point value, defaults to have a precision 2 decimal numbers
}, {
name: "Number",
label: "Number",
cell: "string"
}, {
name: "Name",
label: "Name",
cell: "string"
},
{
name: "IsActive",
label: "IsActive",
cell: "boolean"
}
];
// initialize a new grid instance.
var pageableGrid = new Backgrid.Grid({
columns: [
{
name:"",
cell: "select-row",
headercell: "select-all"
}].concat(columns),
collection: pageableVendors
});
// render the grid.
var $p = $("#vendor-grid").append(pageableGrid.render().el);
// Initialize the paginator
var paginator = new Backgrid.Extension.Paginator({
collection: pageableVendors
});
// Render the paginator
$p.after(paginator.render().el);
// Initialize a client-side filter to filter on the client
// mode pageable collection's cache.
var filter = new Backgrid.Extension.ClientSideFilter({
collection: pageableVendors,
fields: ['Name']
});
// REnder the filter.
$p.before(filter.render().el);
//Add some space to the filter and move it to teh right.
$(filter.el).css({ float: "right", margin: "20px" });
// Fetch some data
pageableVendors.fetch({ reset: true });@{
ViewBag.Title = "BackGridIndex";
}
<h2>BackGridIndex</h2>
<div id="vendor-grid"></div>
@section styles {
@Styles.Render("~/Scripts/backgrid.css")
@Styles.Render("~/Scripts/backgrid-select-all.min.css")
@Styles.Render("~/Scripts/backgrid-filter.min.css")
@Styles.Render("~/Scripts/backgrid-paginator.min.css")
}
@section scripts {
@Scripts.Render("~/Scripts/underscore.min.js")
@Scripts.Render("~/Scripts/backbone.min.js")
@Scripts.Render("~/Scripts/backgrid.js")
@Scripts.Render("~/Scripts/backgrid-select-all.min.js")
@Scripts.Render("~/Scripts/backbone.paginator.min.js")
@Scripts.Render("~/Scripts/backgrid-paginator.min.js")
@Scripts.Render("~/Scripts/backgrid-filter.min.js")
@Scripts.Render("~/Scripts/Robbys/BackGridIndex.js")
}当用户编辑的行，它成功地触发该撞击model.Save（）方法，并传递模型到保存动作，在这种情况下BackGridSave并成功保存记录发生了变化，但似乎只有其中一家供应商发生了变化，才将所有供应商都保存在模型中。有没有办法从JavaScript/Backbone.js/BackGrid到只通过一个供应商 - 更改的供应商？
更新：我意识到它不会发送每个供应商，但它多次发送相同的供应商，就好像更改事件多次触发一样。
“将所有供应商保存在模型中” - 通常在Backbone中模型表示单个记录，而集合表示一组记录。也许你需要使用一个集合而不是一个模型。 – mikeapr4
您不需要调用父类的初始化'Backbone.Model.prototype.initialize.apply（this，arguments）;'，因为初始化的目的将被覆盖。 –
另外，请包含[mcve]。 –