Backbone.js sync Collection
The Backbone.js sync Collection is the function that the collection calls every time attempts to request the server. When a collection begins a sync with the server, a request event is emitted. If the request completes successfully you’ll get a sync event and an error event if not.
Syntax:
collection.sync( method, model, options );
Parameters: It takes three parameters that are discussed below:
- method: It is the CRUD method, which stands C for create, R for read, U for update, and D for delete.
- collection: It is a collection which behalf of which a request to use is made.
- options: It is success and error callbacks and other information.
Example 1: In this example, we will illustrate the Backbone.js sync Collection. Here we will fetch the data which will eventually call the sync function of collection.
HTML
<!DOCTYPE html>
< html >
< head >
< title >BackboneJS sync Collection</ title >
< script src =
type = "text/javascript" >
</ script >
< script src =
type = "text/javascript" >
</ script >
< script src =
type = "text/javascript" >
</ script >
</ head >
< body >
< h1 style = "color: green;" >
GeeksforGeeks
</ h1 >
< h3 > BackboneJS sync Collection </ h3 >
< script type = "text/javascript" >
var geek = new Backbone.Collection({
coll: 'car',
url: '/car',
});
geek.sync = function (method, collection) {
document.write(`This is sync function which
is called for ${method} an collection ` +
JSON.stringify(collection), '< br >');
};
geek.fetch();
</ script >
</ body >
</ html >
|
Output:
Backbone.js sync collection
Example 2: In this example, we will make the user define save function to the collection which will sync with the server, and on success, it will print a success message and on error, it will print an error message.
HTML
<!DOCTYPE html>
< html >
< head >
< title >BackboneJS sync Collection</ title >
type = "text/javascript" >
</ script >
< script src =
type = "text/javascript" >
</ script >
< script src =
type = "text/javascript" >
</ script >
</ head >
< body >
< h1 style = "color: green;" >
GeeksforGeeks
</ h1 >
< h3 > BackboneJS sync Collection </ h3 >
< div id = '1' ></ div >
< script type = "text/javascript" >
var Book = Backbone.Model.extend();
function SUC() {
document.getElementById('1').append
("Demonstrating Success method of sync"
+ " Collection Data Saved successfully")
}
function ERR() {
document.getElementById('1').
append('Demonstrating error method '
+ 'of sync Collection Error!')
}
var Books = Backbone.Collection.extend({
model: Book,
save: function (method) {
Backbone.sync(method, this,
{ success: SUC, error: ERR });
}
});
var k = new Books();
k.save('update');
</ script >
</ body >
</ html >
|
Output:
Backbone.js sync Collection
Reference: https://backbonejs.org/#Collection-sync
Last Updated :
01 Aug, 2022
Like Article
Save Article
Share your thoughts in the comments
Please Login to comment...