Hello-World
Hello-World

Reputation: 9545

remove model in collection and fire remove event - backbone.js

how do I remove remove a model in collection and make the remove event fire . I tried people.remove([{ name: "joe3" }]); but it wont work.

var Person = Backbone.Model.extend({

    initialize: function () {
        console.log(" person is initialized");
    },
    defaults: {
        name: "underfined",
        age:"underfined"
    }
});

var People = Backbone.Collection.extend({
    initialize: function () {
        console.log("people collection is initialized");
        this.bind('add', this.onModelAdded, this);
        this.bind('remove', this.onModelRemoved, this);
    },
    model: Person,
    onModelAdded: function(model, collection, options) {
        console.log("options = ", options);
        alert("added");
    },
    onModelRemoved: function (model, collection, options) {
        console.log("options = ", options);
        alert("removed");
    },
});

//var person = new Person({ name: "joe1" });
var people = new People();



//people.add([{ name: "joe2" }]);
people.add([{ name: "joe1" }]);
people.add([{ name: "joe2" }]);
people.add([{ name: "joe3" }]);
people.add([{ name: "joe4" }]);
people.add([{ name: "joe5" }]);

people.remove([{ name: "joe3" }]);



console.log(people.toJSON());

Upvotes: 18

Views: 55405

Answers (5)

Alexander Bychkov
Alexander Bychkov

Reputation: 78

In order to remove "[0]" you can use the following code:

people.findWhere({name: "joe2"}).destroy();

Upvotes: 0

starikovs
starikovs

Reputation: 3398

Another way is shorter a little and fires the remove event for a collection as well:

people.at(2).destroy();
// OR
people.where({name: "joe2"})[0].destroy();

Triggers a "destroy" event on the model, which will bubble up through any collections that contain it.. http://backbonejs.org/#Model-destroy

Upvotes: 6

Benjamin Kaiser
Benjamin Kaiser

Reputation: 2227

For anyone else looking for a remove where, you can simply chain it with a collection.where call. like so to remove all items matching the search:

people.remove(people.where({name: "joe3"}));

see Backbone collection.where

Upvotes: 38

Ihor Shubin
Ihor Shubin

Reputation: 10726

var Person = Backbone.Model.extend({
    defaults: {
        name: "underfined",
        age:"underfined"
    }
});

var People = Backbone.Collection.extend({
    initialize: function () {
        this.bind('remove', this.onModelRemoved, this);
    },
    model: Person,
    onModelRemoved: function (model, collection, options) {
        alert("removed");
    },
    getByName: function(name){
       return this.filter(function(val) {
          return val.get("name") === name;
        })
    }
});

var people = new People();

people.add(new Person({name:"joe1"}));
people.add(new Person({name:"joe2"}));
people.remove(people.getByName("joe1"));

console.info(people.toJSON());

Upvotes: 5

dfsq
dfsq

Reputation: 193261

By doing:

people.remove([{ name: "joe3" }]);

you don't remove a model, because you pass just an plain object which is not connected to people collection. Instead you could do something like this:

people.remove(people.at(2));

Or:

var model = new Person({name: "joe3"});
people.add(model);
...
people.remove(model);

will work as well.

So you need to reference actual model object from a collection;

http://jsfiddle.net/kD9Xu/

Upvotes: 37

Related Questions