How to pass a model(data) from one view to another in Backbone and edit/delete it?

Question

I have a web application using BackboneJS. In this application, I have a LayoutView.js file in which there is a Backbone View (called LayoutView). LayoutView has other functions (methods) that call other views. I am fetching some data in the initialize function of LayoutView, and I need to get this same data (model) in another view and work (update/delete) on it. Below is how I am passing data from LayoutView to myView:

var LayoutView = Backbone.View.extend({
    el: $("#mi-body"),
    initialize: function () {
        var that = this;
        this.ConfigData = new Configurations(); //Configurations is a collection
        this.ConfigData.fetch({ 
            success: function () {
                alert("success");
            },
            error: function () {
                alert("error");
            }
        });
        this.render();
        Session.on('change:auth', function (session) {
            var self = that;
            that.render();

        });
    },

    render: function () {
        // other code

    },

    events: {
        'click #logout': 'logout',
        'click #divheadernav .nav li a': 'highlightSelected'
    },

    myView: function () {
        if (Session.get('auth')) {
            this.$el.find('#mi-content').html('');
            this.options.navigate('Myview');
            return new MyLayout(this.ConfigData);
        }
    }
});

Still, I do not know how to "get"/access this data as my current data/model/collection (I am not sure which term is correct) in myView and work on it using Backbone's " model.save(), model.destroy() " methods. Also, whenever an edit/delete happens, the data of ConfigData should be modified and the update should reflect in the html displayed to the user.

Below is the code from MyView:

    var MyView = Backbone.View.extend({

    tagName: 'div',

    id: "divConfigurationLayout",

    initialize: function (attrs) {
        this.render();

    },
    render: function () {
        var that = this;

    },

    events: {
        "click #Update": "update",
        "click #delete": "delete"
    },

    update: function(){
//code for updating the data like model.save...
},

delete: function(){
//code for deleting the data like model.destroy...
}
});

Now the data I passed is in attrs in the initialize function. How to get this done..?

Answer 1

The syntax for instantiating a Backbone view is new View(options) where options is an Object with key-value pairs.

To pass a collection to your view, you'd instantiate it like so:

new MyLayout({
    collection : this.configData
});

Within your view, this.collection would refer to your configData collection.