2012-05-14 4 views
14

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.

+1

Welche Version von Backbone, die Buchung von Code hilft immer, eine jsFiddle ist immer fantastisch –

+0

Ja, bitte teilen Sie uns mit einem sehr einfachen Code-Beispiel, das das Problem reproduziert. – fguillen

+1

Sind Sie sicher, dass Sie die Basis-URL für Ihre API in der Erweiterung Ihres Modells angegeben haben? – kinakuta

Antwort

39

Haben Ihre Modelle eine ID? Wenn nicht, wird die HTTP-Anfrage nicht gesendet. - nikoshr 14. Mai um 18:03

Vielen Dank! Nikoshrs kleiner Kommentar war genau das, was ich brauchte. Ich habe die letzten 5 Stunden damit verbracht, damit zu spielen. Ich musste nur eine ID zu den Standardeinstellungen in meinem Modell hinzufügen.

+2

Seien Sie vorsichtig, das Hinzufügen eines ID-Attributs zu den Standardwerten bricht Backbone.Model.isNew() und anschließend .save() 's POST und PUT. – GijsjanB

+1

Warum wird dies nicht akzeptiert:/(Y) – Tamil

+0

Ich denke, oz. ist ein Neuling in Stackoverflow und er weiß nicht, wie das geht. –