Backbone.js parse Model
Last Updated :
27 Jul, 2022
Improve
The Backbone.js parse Model is a function that is called whenever a model's data is returned by the server. This function is passed with the response object and returns the model's data. The model has a default implementation of the parse function but we can override this function for flexible usage.
Syntax:
model.parse( response, options );
Parameters:
- response: It is the raw response object which has to parse for data.
- options: This is an object with information about the raw response object.
Example 1: In this example, we will illustrate The Backbonejs parse Model by overriding the default parse function of the model.
<!DOCTYPE html>
<html>
<head>
<title>BackboneJS parse Model</title>
<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.2.2/backbone-min.js"
type="text/javascript">
</script>
</head>
<body>
<h1 style="color: green;">
GeeksforGeeks
</h1>
<h3>BackboneJS parse Model</h3>
<div id='hello'></div>
<script type="text/javascript">
var Person = Backbone.Model.extend({
urlRoot: 'https://...typicode.com/users/1',
parse: function (response, options) {
for (var i in response) {
document.getElementById("hello")
.append(`${JSON.stringify(i)} :
${JSON.stringify(response[i])}`);
}
}
});
var person = new Person();
person.fetch();
</script>
</body>
</html>
Output:
Example 2: In this example, we will extract all the emails from the response using the parse function.
<!DOCTYPE html>
<html>
<head>
<title>BackboneJS parse Model</title>
<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.2.2/backbone-min.js"
type="text/javascript">
</script>
</head>
<body>
<h1 style="color: green;">
GeeksforGeeks
</h1>
<h3>BackboneJS parse Model</h3>
<p id='hello'></p>
<script type="text/javascript">
var Person = Backbone.Model.extend({
urlRoot: 'https://...typicode.com/users',
parse: function (response, options) {
var self = this;
_.each(response, function (data, pos) {
document.write(`${'email' + pos}
: ${data.email} <br>`);
});
}
});
var person = new Person();
person.fetch();
</script>
</body>
</html>
Output:
Reference: https://backbonejs.org/#Model-parse
