attributes : Attributes define property of a model.
Syntax : model.attributes
Example
Output :
John|12
Changed
This method changes all the attributes which change after setting the attributes using the set() method.
Example
defaults : While creating instance of the model, attributes will be set to their default value.
Syntax :model.defaults()
Example
toJSON : The Backbone.js toJSON model returns copy of the attributes as an object for JSON string.
Syntax : model.toJSON(options)
Example
Output :
create: {"name":"john","class":4}
delete: {"name":"john","class":4,"id":1}
fetch :This method accepts data from the server by delegating the sync() method from model.
Syntax :model.fetch([options])
Example
Output :
read: {"name":"john","class":4}
save : Save a model to your database with indicating to Backbone.sync.
Syntax : model.save([attributes], [options])
Example
Output :
create: {"name":"john","class":4}
Syntax : model.attributes
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:
{
idAttribute:
'id',
name
:'',
age
:''
}
});
var
person = new
student();
person.set({
id: "2"
});
person.set({
name: "John"
});
person.set({
age: "12"
});
document.write(person.get('name')
+ '|'
+ person.get('age'));
</script>
</head>
</html>
Output :
John|12
Changed
This method changes all the attributes which change after setting the attributes using the set() method.
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",
class:
"2"
},
initialize:
function
()
{
this.bind("change:name",
function
(model)
{
document.write('You
have changed your model , chnaged event fired');
});
}
});
var
stuObj = new
student();
document.write('Here
is the result : '
+ stuObj.get("name")
+ '');
stuObj.set({
name: 'john2'
});
document.write('Here
is the result : '
+ stuObj.get("name")
+ '');
</script>
</head>
</html>
Output :
Here is the result : johnYou have changed your model , chnaged event firedHere is the result : john2
defaults : While creating instance of the model, attributes will be set to their default value.
Syntax :model.defaults()
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",
class:
"2"
}
});
var
stuObj = new
student();
document.write('Here
is the result : '
+ stuObj.get("name")
+ '');
stuObj.set({
name: 'john2'
});
document.write('Here
is the result : '
+ stuObj.get("name")
+ '');
</script>
</head>
</html>
Output :
Here is the result : john
Here is the result : john2
Here is the result : john2
Syntax : model.toJSON(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",
class:
"2"
}
});
var
stuObj = new
student();
document.write(JSON.stringify(stuObj));
</script>
</head>
</html>
Output :
{"name":"john","class":"2"}
sync : Backbone sync to represent the state of a model to the server.
Syntax : model.sync(method, model, [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">
Backbone.sync
= function
(method, model)
{
document.write(method
+ ":
"
+ JSON.stringify(model)+''
);
model.set('id',
1);
};
var
student = new
Backbone.Model
({
name:
"john",
class:
4
});
student.save();
student.destroy();
</script>
</head>
</html>
Output :
create: {"name":"john","class":4}
delete: {"name":"john","class":4,"id":1}
fetch :This method accepts data from the server by delegating the sync() method from model.
Syntax :model.fetch([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">
Backbone.sync
= function
(method, model)
{
document.write(method
+ ":
"
+ JSON.stringify(model) + '');
model.set('id',
1);
};
var
student = new
Backbone.Model
({
name:
"john",
class:
4
});
student.fetch();
</script>
</head>
</html>
Output :
read: {"name":"john","class":4}
save : Save a model to your database with indicating to Backbone.sync.
Syntax : model.save([attributes], [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">
Backbone.sync
= function
(method, model)
{
document.write(method
+ ":
"
+ JSON.stringify(model) + "");
model.set('id',
1);
};
var
student = new
Backbone.Model
({
name:
"john",
class:
4
});
student.save();
</script>
</head>
</html>
Output :
create: {"name":"john","class":4}
