Collections
A collection is a number of model used bind event. You can loop through collections and made change respective models. Collection support sorting and filtering. A model structure and instance should be created before creating a collection.Beside from their own events, collections also proxy through all of the events that occur to models within them.It also provides helper functions to perform aggregation and computation against a list of models.
The following lists of methods that you can use to work on Collection.
extend : The extend method extend the backbone's collection class and create custom collection.
Syntax:
Backbone.Collection.extend(properties, classProperties)
Example
Output :
This is a initial function.Name :johnclass :12
model : You must override model property of the collection class and specify the model class in collection contains.
Syntax: Backbone.Collection.model
Example
Output :
The values in the collection are: [{"name":"john","age":12}]
modelId :By default returns the value of the attributes' idAttribute from the collection, you can Override this method to return value.
Syntax: collection.modelId(attrs)
constructor / initialize :While creating a collection, you are open to pass in the initial array of models.If initialize function is there , it will be called during creation of collection.
Syntax: new Backbone.Collection([models], [options])
Example
Output :
This is initialisation function
[{"name":"john","age":"12"}]
models : Collection of models that specify the array or models that are created inside of a collection.
Syntax: collection.models
Example
A collection is a number of model used bind event. You can loop through collections and made change respective models. Collection support sorting and filtering. A model structure and instance should be created before creating a collection.Beside from their own events, collections also proxy through all of the events that occur to models within them.It also provides helper functions to perform aggregation and computation against a list of models.
The following lists of methods that you can use to work on Collection.
extend : The extend method extend the backbone's collection class and create custom collection.
Syntax:
Backbone.Collection.extend(properties, classProperties)
Example
<!DOCTYPE
html>
<html>
<head>
<script
src="https://code.jquery.com/jquery-2.1.3.min.js"
type="text/javascript"></script>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.2/underscore-min.js"
type="text/javascript"></script>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.1.2/backbone-min.js"
type="text/javascript"></script>
<script
type="text/javascript">
student
= Backbone.Model.extend({
defaults:
{
name:
"",
class:
""
},
initialize:
function
(a, b) {
document.write("This
is a initial function.");
this.set("name",
a);
this.set("class",
b);
}
});
var
mymodel = new
student('john',
12);
document.write('Name
:'
+ mymodel.get('name')
+ '');
document.write('class
:'
+ mymodel.get('class')
+ '');
</script>
</head>
</html>
This is a initial function.Name :johnclass :12
model : You must override model property of the collection class and specify the model class in collection contains.
Syntax: Backbone.Collection.model
Example
<!DOCTYPE
html>
<html>
<head>
<script
src="https://code.jquery.com/jquery-2.1.3.min.js"
type="text/javascript"></script>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.2/underscore-min.js"
type="text/javascript"></script>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.1.2/backbone-min.js"
type="text/javascript"></script>
<script
type="text/javascript">
var
student = Backbone.Model.extend({
defaults:
{
name:
"john",
age:
12
}
});
var
myCollcetion = Backbone.Collection.extend({
model:
student
});
var
myval = new
myCollcetion({});
document.write("The
values in the collection are: ",
JSON.stringify(myval));
</script>
</head>
</html>
Output :
The values in the collection are: [{"name":"john","age":12}]
modelId :By default returns the value of the attributes' idAttribute from the collection, you can Override this method to return value.
Syntax: collection.modelId(attrs)
constructor / initialize :While creating a collection, you are open to pass in the initial array of models.If initialize function is there , it will be called during creation of collection.
Syntax: new Backbone.Collection([models], [options])
Example
<!DOCTYPE
html>
<html>
<head>
<script
src="https://code.jquery.com/jquery-2.1.3.min.js"
type="text/javascript"></script>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.2/underscore-min.js"
type="text/javascript"></script>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.1.2/backbone-min.js"
type="text/javascript"></script>
<script
type="text/javascript">
var
student = Backbone.Model.extend({
defaults:
{
name:
"john",
age:
"12"
},
initialize:
function
() {
document.write("This
is initialisation function");
}
});
var
stuCollcetion = Backbone.Collection.extend({
model:
student
});
var
stuObj = new
student({
name:
"john",
age:
"12"
});
var
myval = new
stuCollcetion([stuObj]);
document.write("
" + JSON.stringify(myval.models));
" + JSON.stringify(myval.models));
</script>
</head>
</html>
Output :
This is initialisation function
[{"name":"john","age":"12"}]
models : Collection of models that specify the array or models that are created inside of a collection.
Syntax: collection.models
Example
<!DOCTYPE
html>
<html>
<head>
<script
src="https://code.jquery.com/jquery-2.1.3.min.js"
type="text/javascript"></script>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.2/underscore-min.js"
type="text/javascript"></script>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.1.2/backbone-min.js"
type="text/javascript"></script>
<script
type="text/javascript">
var
student = Backbone.Model.extend({
defaults:
{
name:
"john",
age:
"12"
}
});
var
stuCollcetion = Backbone.Collection.extend({
model:
student
});
var
stuObj1 = new
student({
name:
"john1",
age:
"13"
});
var
stuObj2 = new
student({
name:
"john3",
age:
"14"
});
var
myval = new
stuCollcetion([stuObj1, stuObj2]);
document.write("
" + JSON.stringify(myval.models));
" + JSON.stringify(myval.models));
</script>
</head>
</html>
Output:
[{"name":"john1","age":"13"},{"name":"john3","age":"14"}]
No comments:
Post a Comment