Tuesday, 12 June 2018

017 BackboneJS Collection sort,pluck,where,findWhere,url

sort :sort method re-sort a collection.

Syntax :collection.sort([options])


<!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>

Example

<script type="text/javascript">

var student = Backbone.Model.extend({
defaults:
{
name: "",
class: ""
}
});


var students =
[
{ name: 'John6', class: '3' },
{ name: 'John3', class: '4' },
{ name: 'John7', class: '9' }
];


var objCollcetion = new Backbone.Collection(students,
{
model: student,
comparator: 'name'
});

document.write('Here is the sorted result' + '');

objCollcetion.each(function (model, index, list) {
document.write(model.get('name') + '|' + model.get('class') + '');
});

</script>
</head>
</html>


 Output :

Here is the sorted result
John3|4
John6|3
John7|9



pluck : Pluck an attribute from model in a collection. 

Syntax : collection.pluck(attribute)

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: "",
class: ""
}
});


var students =
[
{ name: 'John6', class: '3' },
{ name: 'John3', class: '4' },
{ name: 'John7', class: '9' }
];


var objCollcetion = new Backbone.Collection(students,
{
model: student,
comparator: 'name'
});

objCollcetion.pluck('name')

document.write("Attributes returned on pluck:
"
, objCollcetion.pluck('name'));
</script>
</head>
</html>


Output :

Attributes returned on pluck:
John3,John6,John7

where : where method retrieves and display the model by using the matched attribute in the collection.

Syntax :collection.where(attribute)  

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: "",
class: ""
}
});


var students =
[
{ name: 'John6', class: '3' },
{ name: 'John3', class: '4' },
{ name: 'John7', class: '9' }
];


var objCollcetion = new Backbone.Collection(students,
{
model: student,
comparator: 'name'
});

var myteam = objCollcetion.where({ name: 'John6' })

document.write(JSON.stringify(myteam));
</script>
</head>
</html>


Output :

[{"name":"John6","class":"3"}]


findWhere : Similar to where, return  first model in the collection with  matches.
 

Syntax :collection.findWhere(attributes)


<!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: "",
class: ""
}
});


var students =
[
{ name: 'John6', class: '3' },
{ name: 'John3', class: '4' },
{ name: 'John7', class: '9' }
];


var objCollcetion = new Backbone.Collection(students,
{
model: student,
comparator: 'name'
});

var myteam = objCollcetion.findWhere({ name: 'John6' })

document.write(JSON.stringify(myteam));
</script>
</head>
</html>


Output :

{"name":"John6","class":"3"}


url : Returns the relative URL where the model's resource is located.

Syntax :model.url()


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
({
urlRoot: '/tutorialspoint/backbonejs'
});

var stuObj = new student();

document.write(stuObj.url());
</script>
</head>
</html>


Output :
/tutorialspoint/backbonejs





 




 











No comments:

Post a Comment

বাঙালির বেড়ানো সেরা চারটি ঠিকানা

  বাঙালি মানে ঘোড়া পাগল | দু একদিন ছুটি পেলো মানে বাঙালি চলল ঘুরতে | সে সমুদ্রই হোক , পাহাড়ি হোক বা নদী হোক। বাঙালির ...