Ich habe seit Tagen versucht, das funktioniert zu bekommen und ich kann einfach nicht herausfinden, warum, wenn ich meine Ansicht habe, ein Modell zu zerstören, das zu einer Sammlung gehört (was richtig hat ein URL-Attribut für den Beginn des Abrufs von Modelldaten, feuert nur das Destroy-Ereignis, das in die Sammlung gesprudelt wird, um durch meine Listenansicht einfach gebunden zu werden. Aber es sendet niemals eine tatsächliche DELETE-Anfrage oder irgendeine Anfrage an den Server überhaupt. Überall, wo ich hinsehe, sehe ich, dass jeder entweder die URL der URL der Sammlung oder urlRoot verwendet, wenn das Modell nicht mit einer Sammlung verbunden ist. Ich habe sogar vor der tatsächlichen this.model.destroy() getestet, um das Modell zu überprüfen < console.log (this.model.url());Backbone.js model.destroy() nicht senden DELETE Anfrage
Ich habe die Zerstörer noch Sync-Methoden für Backbone nicht überschrieben. Außerdem hat jedes Modell ein ID-Attribut, das über den Abruf der Sammlung (aus Datenbankdatensätzen) gefüllt wird.
Die Zerstörung findet in der Listenansicht statt und das Ereignis "destroy" der Sammlung wird in der Listenansicht gebunden. Alles funktioniert gut (die Ereignisbehandlung), aber das Problem ist wiederum, es gibt keine Anfrage an den Server.
Ich hatte gehofft, dass backbone.js es automatisch tun würde. Das ist es, was die Dokumentation impliziert, sowie die zahlreichen Beispiele überall.
Vielen Dank an alle, die etwas nützlichen Input geben können.
FYI: Ich entwickle auf wampserver PHP 5.3.4.
ListItemView = BaseView.extend({
tagName: "li",
className: "shipment",
initialize: function (options) {
_.bindAll(this);
this.template = listItemTemplate;
this.templateEmpty = listItemTemplateEmpty;
},
events: {
'click .itemTag' : 'toggleData',
'click select option' : 'chkShipper',
'click .update' : 'update',
'click button.delete' : 'removeItem'
},
// ....
removeItem: function() {
debug.log('remove model');
var id = this.model.id;
debug.log(this.model.url());
var options = {
success: function(model, response) {
debug.log('remove success');
//debug.log(model);
debug.log(response);
// this.unbind();
// this.remove();
},
error: function(model, response) {
debug.log('remove error');
debug.log(response);
}
};
this.model.destroy(options);
//model.trigger('destroy', this.model, this.model.collection, options);
}
});
Collection = Backbone.Collection.extend({
model: Model,
url: '?dispatch=get&src=shipments',
url_put : '?dispatch=set&src=shipments',
name: 'Shipments',
initialize: function() {
_.bindAll(this);
this.deferred = new $.Deferred();
/*
this.fetch({
success: this.fetchSuccess,
error: this.fetchError
});
*/
},
fetchSuccess: function (collection, response) {
collection.deferred.resolve();
debug.log(response);
},
fetchError: function (collection, response) {
collection.deferred.reject();
debug.log(response);
throw new Error(this.name + " fetch failed");
},
save: function() {
var that = this;
var proxy = _.extend(new Backbone.Model(),
{
url: this.url_put,
toJSON: function() {
return that.toJSON();
}
});
var newJSON = proxy.toJSON()
proxy.save(
newJSON,
{
success: that.saveSuccess,
error: that.saveError
}
);
},
saveSuccess: function(model, response) {
debug.log('Save successful');
},
saveError: function(model, response) {
var responseText = response.responseText;
throw new Error(this.name + " save failed");
},
updateModels: function(newData) {
//this.reset(newData);
}
});
ListView = BaseView.extend({
tagName: "ul",
className: "shipments adminList",
_viewPointers: {},
initialize: function() {
_.bindAll(this);
var that = this;
this.collection;
this.collection = new collections.ShipmentModel();
this.collection.bind("add", this.addOne);
this.collection.fetch({
success: this.collection.fetchSuccess,
error: this.collection.fetchError
});
this.collection.bind("change", this.save);
this.collection.bind("add", this.addOne);
//this.collection.bind("remove", this.removeModel);
this.collection.bind("destroy", this.removeModel);
this.collection.bind("reset", this.render);
this.collection.deferred.done(function() {
//that.render();
that.options.container.removeClass('hide');
});
debug.log('view pointers');
// debug.log(this._viewPointers['c31']);
// debug.log(this._viewPointers[0]);
},
events: {
},
save: function() {
debug.log('shipments changed');
//this.collection.save();
var that = this;
var proxy = _.extend(new Backbone.Model(),
{
url: that.collection.url_put,
toJSON: function() {
return that.collection.toJSON();
}
});
var newJSON = proxy.toJSON()
proxy.save(
newJSON,
{
success: that.saveSuccess,
error: that.saveError
}
);
},
saveSuccess: function(model, response) {
debug.log('Save successful');
},
saveError: function(model, response) {
var responseText = response.responseText;
throw new Error(this.name + " save failed");
},
addOne: function(model) {
debug.log('added one');
this.renderItem(model);
/*
var view = new SB.Views.TicketSummary({
model: model
});
this._viewPointers[model.cid] = view;
*/
},
removeModel: function(model, response) {
// debug.log(model);
// debug.log('shipment removed from collection');
// remove from server
debug.info('Removing view for ' + model.cid);
debug.info(this._viewPointers[model.cid]);
// this._viewPointers[model.cid].unbind();
// this._viewPointers[model.cid].remove();
debug.info('item removed');
//this.render();
},
add: function() {
var nullModel = new this.collection.model({
"poNum" : null,
"shipper" : null,
"proNum" : null,
"link" : null
});
// var tmpl = emptyItemTmpl;
// debug.log(tmpl);
// this.$el.prepend(tmpl);
this.collection.unshift(nullModel);
this.renderInputItem(nullModel);
},
render: function() {
this.$el.html('');
debug.log('list view render');
var i, len = this.collection.length;
for (i=0; i < len; i++) {
this.renderItem(this.collection.models[i]);
};
$(this.container).find(this.className).remove();
this.$el.prependTo(this.options.container);
return this;
},
renderItem: function (model) {
var item = new listItemView({
"model": model
});
// item.bind('removeItem', this.removeModel);
// this._viewPointers[model.cid] = item;
this._viewPointers[model.cid] = item;
debug.log(this._viewPointers[model.cid]);
item.render().$el.appendTo(this.$el);
},
renderInputItem: function(model) {
var item = new listItemView({
"model": model
});
item.renderEmpty().$el.prependTo(this.$el);
}
});
P. S ... Auch hier gibt es Code, der von anderswo verwiesen wird. Aber bitte beachten Sie: Die Sammlung hat ein URL-Attribut gesetzt. Und es funktioniert sowohl beim ersten Abruf als auch beim Auslösen eines Änderungsereignisses zum Speichern der an den Modellen vorgenommenen Änderungen. Aber das Ereignis destroy in der List-Item-Ansicht, während es das "destroy" -Ereignis erfolgreich auslöst, sendet es nicht die 'DELETE' HTTP-Anfrage.
Welche Version von Backbone, die Buchung von Code hilft immer, eine jsFiddle ist immer fantastisch –
Ja, bitte teilen Sie uns mit einem sehr einfachen Code-Beispiel, das das Problem reproduziert. – fguillen
Sind Sie sicher, dass Sie die Basis-URL für Ihre API in der Erweiterung Ihres Modells angegeben haben? – kinakuta