Home/ Questions/Q 6871441
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-27T03:48:26+00:00

I’m running into a blind spot with backbone.js. I’ve written this code and all

  • 0

I’m running into a blind spot with backbone.js. I’ve written this code and all I’m trying to do is get
the test div to render on button click. If I call render() within the initialize() function, it does render.
However, I never trigger the render() function in response to the click event.

What am I missing?

Thanks!

HTML Container

<!DOCTYPE html>
<html>
  <head>
    <meta charset='utf-8' />
    <!-- / Always force latest IE rendering engine (even in intranet) & Chrome Frame -->
    <meta content='IE=edge,chrome=1' />
    <meta http-equiv='X-UA-Compatible' />
    <link type="text/css" rel="stylesheet" href="/stylesheets/site.css" media="screen" />
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>
    <script type="text/javascript" src="/javascripts/underscore-min.js"></script>
    <script type="text/javascript" src="/javascripts/backbone-min.js"></script>
    <script type="text/javascript" src="/javascripts/application.js"></script>
    <script type="text/javascript" src="/javascripts/sample_data.js"></script>
    <title>The Middleman!</title>
  </head>
  <body class='page_classes'>
    <div id='main' role='main'>
      <h1>The Middleman is watching.</h1>
      <div id='band-app'>
        <button id='new-band'>new band</button>
      </div>
    </div>
  </body>
</html>

Coffeescript for simple view

SAMPLE_TEMPLATE = """
<div id="my-fine-id">
  My fine id!!!
</div>
"""

$ ->
  class AppView extends Backbone.View
    render: ->
      console.log "rendering"
      @template = _.template SAMPLE_TEMPLATE, {}
      @el.html @template

    initialize: ->
      console.log "constructing"
      @el = $('#band-app')
      @events = {"click button#new-band": "render"}

  app = new AppView()
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    I think delegateEvents, which sets up the event handling, gets called in the View constructor, before initialize gets called, so either call it explicitely in your initialize method (after you have set up the events map), or make sure that the events map is set up as part of constructing the View class itself, see:

    http://documentcloud.github.com/backbone/#View-extend

    • 0