In this article, we will discuss pop collection The Backbone.js pop collection is used to remove a model or an array of models from the given collection. It is similar to the remove method.
Syntax:
collection.pop(models,options)
Parameters: It will take two parameters.
- models: this is the first parameter that is used to specify the names of the instances,
- options: this parameter takes the model type which will be removed from the given collection.
Example 1: In this example, we will create a model Food and remove food1 using pop.
HTML
<!DOCTYPE html> < html >
< head >
type = "text/javascript" ></ script >
< script src =
type = "text/javascript" ></ script >
< script src =
type = "text/javascript" ></ script >
< script type = "text/javascript" >
//'Food' is a model and that contains the
//default value for the model
var Food = Backbone.Model.extend({
defaults: {
food_name: "Butter",
food_region:"Hyderabad"
}
});
// 'FoodCollection' is a collection instance and
// 'Food' is specified by overriding the 'model' property
var FoodCollection = Backbone.Collection.extend({
model: Food
});
// "food1" and "food2" are created for the model "Food"
var food1 = new Food({name: "Icecream", country:"Hyderabad"});
var food2 = new Food({name: "cake/chocos", country:"Guntur"});
// add() method adds the models 'food1' and 'food2'
// to the collection instance 'final'
var final = new FoodCollection();
final.add([food1,food2]);
// get the count of total food using length
document.write('Actual Food Count : ' + final.length);
document.write("< br >");
// remove food1 model using pop
final.pop([food1]);
document.write('Popped Food Count : ' + final.length);
</ script >
</ head >
< body ></ body >
</ html >
|
Output:
Actual Food Count : 2 Popped Food Count : 1
Example 2: In this example, we will create a model Food and remove food1 and food3 using pop.
HTML
<!DOCTYPE html> < html >
< head >
type = "text/javascript" ></ script >
< script src =
type = "text/javascript" ></ script >
< script src =
type = "text/javascript" ></ script >
< script type = "text/javascript" >
//'Food' is a model and that contains the default value for the model
var Food = Backbone.Model.extend({
defaults: {
food_name: "Butter",
food_region:"Hyderabad"
}
});
// 'FoodCollection' is a collection instance and
// 'Food' is specified by overriding the 'model' property
var FoodCollection = Backbone.Collection.extend({
model: Food
});
// "food1","food2" and "food3" are created for the model "Food"
var food1 = new Food({name: "Icecream", country:"Hyderabad"});
var food2 = new Food({name: "cake/chocos", country:"Guntur"});
var food3 = new Food({name: "drinks", country:"Guntur"});
// add() method adds the models 'food1' and 'food2'
// to the collection instance 'final'
var final = new FoodCollection();
final.add([food1,food2,food3]);
// get the count of total food using length
document.write('Actual Food Count : ' + final.length);
document.write("< br >");
// remove food1 and food3 model using pop
final.pop([food1,[food3]]);
document.write('Removed Food Count : ' + final.length);
</ script >
</ head >
< body ></ body >
</ html >
|
Output:
Actual Food Count : 3 Removed Food Count : 2