Backbone.View: Delete different views related to different models

Question

I need to display three different views which are related to three different model or collections.
In order to perform this task I wrote the following code. (*)
Please tell me if it is the right way to make this, anyway it works.

Here my problem.
In one of this view, let's say the firstView, is possible to perform a DELETE request to the server which take care to delete all the data related to this three view.

Now I need to delete my three view… but from the firstView I cannot access to the others two views.

1) How can I perform this task?
2) Should I redesign/improve my implementation?

---

(*)

// module for display three different views

define([
    "js/views/01View",
    "js/views/02View",
    "js/views/03View"
], function (FirstView, SecondView, ThirdView) {

    var MainView = Backbone.View.extend({

        initialize: function ()
        {
            this.render();
        },

        render: function ()
        {
            var movie_id = this.options.movie_id;
            this.firstView = new FirstView(movie_id);
            this.secondView = new SecondView(movie_id);
            this.thirdView = new ThirdView(movie_id);
        }
    });    

    return MainView;
});

---

P.S.:

The _id is used to build the url parameter of collections or models

url1: http://localhost/movie/movie_id   (model1)
url2: http://localhost/movie/movie_id/followers   (collection2)
ulrs: http://localhost/movie/movie_id/feeds (collection3)

When I delete the model1 the view2 and view3 related to collection2 and collection3 should be removed.

Answer 1

To fit your problem based on our comments conversation, Backbone architecture revolves using events, so why not use an event aggregator to send events around, don't limit yourself to the backbone constructs. fire an event from one view to another in backbone This pattern provides an elegant solution to your problem.

Answer 2

Views should not respond to direct method calls but to events. Said that you either create a common EventAggregator accesible from every View (as @20100 has explained in his answer) or you connect the Views through a common Model and make each View to listen to its own more interesting events on it.

In your case you can instantiate the Movie model out of the Views instantiations and connect the three Views around it:

// code simplified and not tested
var MainView = Backbone.View.extend({
  initialize: function ( opts ) {
    this.movie = new Movie({ id: this.opts.movie_id} )
    this.movie.fetch();
    this.render();
  },

  render: function () {
    this.firstView = new FirstView( this.movie );
    this.secondView = new SecondView( this.movie );
    this.thirdView = new ThirdView( this.movie );
  }
});

var ThirdView = Backbone.View.extend({
  initialize: function( opts ) {
    this.movie = opts.movie;
    this.movie.on( "destroy", this.cleanUp, this )
    this.followers = // fetch the followers as you do now, use this.model.id
  }

  cleanUp: function(){
    // your clean up code when model is detroyed
  }
});