当我单击提交按钮时,尽管每次单击复选框更改事件都会触发,但我看不到对集合所做的更改
//Model
Wine = Backbone.Model.extend({
// Toggle the `IsSelected` state of this todo item.
toggle: function () {
debugger;
this.save({
IsSelected: !this.get('IsSelected')
});
}
});
//Collection
WineCollection = Backbone.Collection.extend({
model: Wine,
url: "http://localhost/Industries/data/data.json"
});
//这是一个列表视图集合和单个列表项,在这里我们绑定复选框的单击事件,并在此处的提交按钮中检查更改的值
WineListView = Backbone.View.extend({
el: $('#wineList'),
initialize: function () {
alert($('#divBtnSubmit'));
wineList.bind("reset", this.render, this);
},
render: function () {
wineList.each(function (wine) {
$(this.el).append(new WineListItemView({ model: wine }).render().el);
}, this);
return this;
}
});
//Submit button
WinedivBtnSubmit = Backbone.View.extend({
el: $('#divBtnSubmit'),
initialize: function () {
this.render();
},
render: function () {
// Load the compiled HTML into the Backbone "el"
var template = _.template($("#save-div").html(), {});
this.$el.append(template);
},
events: {
"click #divBtnSubmit1": "saveWine"
},
saveWine: function () {
debugger;
wineList.each(function (wine) {
alert(wine.get('ID') + '<<>>' + wine.get('IsSelected'));
});
return false;
// alert(this.modelmodels);
}
});
//Indiviual list item
WineListItemView = Backbone.View.extend({
tagName: "li",
template: _.template($('#wine-list-item').html()),
initialize: function () {
},
events:
{
'click .toggle': 'toggleVisible'
},
toggleVisible: function () {
this.model.toggle();
},
render: function (eventName) {
$(this.el).html(this.template(this.model.toJSON()));
return this;
}
});
var AppRouter = Backbone.Router.extend({
routes: {
"": "list",
"wines/:id": "wineDetails"
},
initialize: function () {
},
list: function () {
// this.wineList = new WineCollection();
this.wineListView = new WineListView();
this.btn = new WinedivBtnSubmit();
// wineList.fetch();
},
wineDetails: function (id) {
this.wine = this.wineList.get(id);
this.wineView = new WineView({ model: this.wine });
this.wineView.render();
}
});
wineList = new WineCollection();
wineList.fetch();
// on every click of checkbox this event is fired
wineList.bind("change", function () {
alert('list changed');
});
var app = new AppRouter();
Backbone.history.start();