Backbone.js create Collection

Last Updated : 18 Jul, 2022

The Backbone.js create Collection is used to create an instance of model inside of collection. The Create method of Collection is equivalence to instantiating a model, saving the model to the server and adding model to set after successfully creation and save model to server. If the validation of model fails, then it will be unsaved with validation error. The create method can accept hash attributes or unsaved model.

Syntax:

collection.create( attributes, options );

Parameters: It accepts the following parameters:

attributes: It is an attribute hash of model which we will create.
options: It is options to be passed down during model instantiation.

In the below examples, we will use the Backbone.js create Collection.

Example 1: In this example, we will use hash attributes to create model inside collection.

HTML

<!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.2.2/backbone-min.js"
            type="text/javascript"> 
    </script> 
</head> 
  
<body> 
    <h1 style="color: green;"> 
        GeeksforGeeks 
    </h1> 
    <h3>BackboneJS create collection</h3> 
    <script type="text/javascript"> 
  
        var Book = Backbone.Model.extend(); 
  
        var books = Backbone.Collection.extend({ 
            model: Book, 
            url: 'https://jsonplaceholder.typicode.com/posts', 
        }); 
  
        var Library = new books; 
  
  
        Library.create({ 
            title: "The Religion of Man", 
            author: "Rabindranath Tagore" 
        }); 
  
        Library.create({ 
            title: "Winner takes Nothing", 
            author: "Ernest Hemingway" 
        }); 
  
        document.write(JSON.stringify(Library)); 
    </script> 
</body> 
  
</html>

Output:

Backbone.js create Collection

Example 2: In this example, we will create model and listen to the add event when we are creating model in collection.

HTML

<!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.2.2/backbone-min.js"
            type="text/javascript"> 
    </script> 
</head> 
  
<body> 
    <h1 style="color: green;"> 
        GeeksforGeeks 
    </h1> 
    <h3>BackboneJS create collection</h3> 
    <script type="text/javascript"> 
  
  
        function print(Model) { 
            document.write(JSON.stringify(Model), "<br>") 
        } 
  
        var Book = Backbone.Model.extend(); 
        var b1 = new Book({ 
            title: "Shame", 
            author: "Salman Rushdie" 
        }); 
  
        var b2 = new Book({ 
            title: "The shadow of lines", 
            author: "Amitav Ghosh" 
        }); 
  
        var books = Backbone.Collection.extend({ 
            model: Book, 
            url: 'https://jsonplaceholder.typicode.com/posts', 
        }); 
  
        var Library = new books; 
        Library.on('add', print); 
        Library.create(b1); 
        Library.create(b2); 
    </script> 
</body> 
  
</html>