Uncaught TypeError: Converting circular structure to JSON : Backbone

Question

I am trying to save a backbone collection like the following :

var backgridModel = Backbone.Model.extend({ });

var BackgridCollection = Backbone.Collection.extend({
    model: backgridModel,
    url : 'api/list'
});

var backgriCollections = new BackgridCollection();
backgriCollections.fetch();

var CreatePuppetRequest = Backbone.Model.extend({
    url : 'api/createTable',
    toJSON: function() {
        console.log(backgriCollections.toJSON());
        return backgriCollections.toJSON();
    }
});

I make the server call like the following :

var puppetTable = new CreatePuppetRequest();
puppetTable.save({}, {
    success : function(model, response) {
        alert("Successfully submitted " + num + " puppet(s)");
        puppetFinalCollection.reset();
        $('#create-puppet-table-button').removeAttr("disabled");
    },
    error : function(model, response) {
        if (response.status == 400)
            that.showErrors($.parseJSON(response["responseText"]));
        else
            console.log(response["responseText"]);
        puppetFinalCollection.reset();
        $('#create-puppet-table-button').removeAttr("disabled");
    }
});

Console output

0: Object
designation: "m"
firstName: "sdfghj"
function (){ return parent.apply(this, arguments); }: Object
lastName: "sdfghj"
__proto__: Object
length: 1
__proto__: Array[0]

function (){ return parent.apply(this, arguments); }: Object is added extra to model that I don't know why it is added?

Added to this I get this Uncaught TypeError: Converting circular structure to JSON which blocks the server call too.

EDIT

after fetch() from the server my data would look like the following JSON string :

[
    {
        "userid": "",
        "firstName": "Mayank",
        "lastName": "Kumar",
        "designation": "Software Engineer"
    },
    {
        "userid": "",
        "firstName": "Shylendra",
        "lastName": "Bhat",
        "designation": "Software Engineer"
    },
    {
        "userid": "",
        "firstName": "Akash",
        "lastName": "Waran",
        "designation": "Software Engineer"
    },
    {
        "userid": "",
        "firstName": "Shreyas",
        "lastName": "Lokkur",
        "designation": "Software Engineer"
    },
    {
        "userid": "",
        "firstName": "Anthony",
        "lastName": "Raj",
        "designation": "Software Engineer"
    },
    {
        "userid": "",
        "firstName": "Dheemanth",
        "lastName": "Bharadwaj",
        "designation": "Software Engineer"
    },
    {
        "userid": "",
        "firstName": "Prasanna",
        "lastName": "Adiga",
        "designation": "Software Engineer"
    }
]

and it is being populated to table too.

Answer 1

I have made mistake when i add model to collection, I have added a type instead of instance of the type.

var backgridModel = Backbone.Model.extend({ });

is the type i should have added

var row = new backgridModel() instead i have used backgridModel to create a new row.