title: How do I send a model that was clicked on within a ItemView to another ItemView that is on the same page?
body: <p>I have a collection of Tools displayed as a CompositeView. Each of the rendered items in this collection is an ItemView. The name of the region that holds these is called toolNameRegion.</p>
  
  <p>I have another region named toolDetailsRegion in that page and it has its supposed to render the attributes of the clicked tool in the toolNameRegion.</p>
  
  <p>Here is the view:</p>
  
  <pre><code>@Tools.module "AboutApp.Show", (Show, App, Backbone, Marionette, $, _) -&gt;
  
    class Show.Layout extends Backbone.Marionette.Layout
      template: JST['backbone/apps/about/templates/about']
  
      regions:
        toolNameRegion:  "#tool-name"
        toolDetailsRegion: "#tool-details"
  
    class Show.Tool extends Backbone.Marionette.ItemView
      template: JST['backbone/apps/about/templates/_tool']
      tagName: "li"
  
      events:
        "click a.tool-link" : -&gt; 
          @trigger "tool-name:link:clicked", @model # How the hell do I pass this to the Show.ToolDetail class?
          console.log @model # shows the model attributes that was clicked
  
    class Show.Tools extends Backbone.Marionette.CompositeView
      template: JST['backbone/apps/about/templates/tools']
      itemView: Show.Tool
      itemViewContainer: "ul"
  
      triggers:
        "click .tool-link" : "tool:link:clicked"
  
    class Show.ToolDetail extends Backbone.Marionette.ItemView
      template: JST['backbone/apps/about/templates/tool_details']
      itemView: Show.Tool
  
      onShow: -&gt; console.log "onShow"
      onClose: -&gt; console.log "onClose"
  </code></pre>
  
  <p>Here is the controller:</p>
  
  <pre><code>@Tools "AboutApp.Show", (Show, App, Backbone, Marionette, $, _) -&gt;
  
    Show.Controller =
  
      showAbout: -&gt;
        tools = App.request "get:tools"
        @aboutLayout = @getAboutLayout()
  
        @aboutLayout.on "show", =&gt;
          @showTools tools
          @showInitialTool tools
  
        App.mainRegion.show @aboutLayout
  
      showTools: (tools) -&gt;
        toolsView = @getToolsView tools   
        console.log toolsView
  
        toolsView.on "tool:link:clicked", (tool) =&gt;
          console.log "model: #{tool}"
          tool = @getInitialToolView tool
          @aboutLayout.toolDetailsRegion.show tool
  
      @aboutLayout.toolNameRegion.show toolsView
  
  
    getToolsView: (tools) -&gt;
      new Show.Tools
        collection: tools
  
    showInitialTool: (tools) -&gt;
      initial_tool = tools.at(1) 
      toolView = @getInitialToolView initial_tool
      @aboutLayout.toolDetailsRegion.show toolView
  
    getToolDetailsView:  -&gt;
      App.request "tool:detail:view"
  
    toolDetailsRegion: -&gt;
      toolDetailView = @getInitialToolView 
      @about.toolDetailsRegion.show toolDetailView
  
    getInitialToolView: (tool) -&gt;
      new Show.ToolDetail
        model: tool
  
    getAboutLayout: -&gt;
      new Show.Layout
  </code></pre>
  
  <p>How do I pass in the @model (model that was clicked on) to the controller so @model can be passed to the view class Show.ToolDetail so that the toolDetailsRegion can be updated dynamically?</p>
  
  <p>Here's my Entities (resources):</p>
  
  <pre><code>@Tools.module "Entities", (Entities, App, Backbone, Marionette, $, _) -&gt;
  
    class Entities.Tool extends Backbone.Model
  
    class Entities.ToolCollection extends Backbone.Collection
      model: Entities.Tool
      url: -&gt; Routes.tools_path()
  
    API =
  
      setTools: (tools) -&gt;
        new Entities.ToolCollection (tools)
  
      getToolEntities: -&gt;
        tools = new Entities.ToolCollection()
        tools.fetch
          reset: true
        tools
  
      App.reqres.setHandler "set:tools", (tools) -&gt;
        API.setTools tools
  
      App.reqres.setHandler "tool:entities", -&gt;
        API.getToolEntities()
  </code></pre>
  
  <p>Thanks for your response @David Sulc. It is still not passing the model through. Maybe I'm not formatting it correctly?</p>
  
  <p>The way I grab the model from the view:</p>
  
  <pre><code>class Show.Tool extends Backbone.Marionette.ItemView
    template: JST['backbone/apps/about/templates/_tool']
    tagName: "li"
  
    events:
      "click a.tool-link" : -&gt; 
        App.request "get:new:tool", @model
        console.log @model
  </code></pre>
  
  <p>In the controller:</p>
  
  <pre><code> showTools: (tools) -&gt;
      toolsView = @getToolsView tools   
      console.log toolsView
  
      toolsView.on "tool:link:clicked", (tool) =&gt;
        console.log "model retrieved from click: #{tool}" # comes up undefined; how to obtain?
        tool = App.request "get:new:tool" # could this be the path, but since tool is undefined, won't work? 
        new_tool = @getInitialToolView tool
        @aboutLayout.toolDetailsRegion.show new_tool
  
    @aboutLayout.toolNameRegion.show toolsView
  </code></pre>
  
  <p>Thanks to @David Sulc for showing me the way!</p>
  
  <p><b>In the controller:</b></p>
  
  <pre><code>  showTools: (tools) -&gt;
      toolsView = @getToolsView tools   
      console.log toolsView
  
      Tools.AboutApp.Show.on "tool-name:link:clicked", (tool) =&gt;
        console.log tool.get('name')
        new_tool = @getInitialToolView tool
        @aboutLayout.toolDetailsRegion.show new_tool 
  </code></pre>
  
  <p><b>In the view code:</b></p>
  
  <pre><code>  class Show.Tool extends Backbone.Marionette.ItemView
      template: JST['backbone/apps/about/templates/_tool']
      tagName: "li"
  
      events:
        "click a.tool-link" : -&gt; 
          Tools.AboutApp.Show.trigger "tool-name:link:clicked", @model
          console.log @model
  
    class Show.ToolDetail extends Backbone.Marionette.ItemView
      template: JST['backbone/apps/about/templates/tool_details']
      itemView: Show.Tool
      Tools.AboutApp.Show.on "tool-name:link:clicked", (tool) =&gt;
        console.log tool
  
      onShow: -&gt; console.log "onShow"
      onClose: -&gt; console.log "onClose"
  </code></pre>