CODEWITHSUNDEEP
backbone.js
Charlie Davies
Charlie Davies

Reputation: 1834

Backbone.js not updating HTML in View

I have the view:

class FoursquareSearch.Views.SearchNew extends Backbone.View

  tagName: 'sidebar'

  template: JST["templates/search/new_search"]

  #events:
  #  'submit': 'create'

  initialize: ->
    @render

  render: ->
    console.log('hello')
    $this = $('#sidebar')
    $this.html('<p>All new content. <em>You bet!</em></p>')
    $this

with this Router

class FoursquareSearch.Routers.Maps extends Backbone.Router

  routes:
    '': 'index'

  index: ->
    FoursquareSearch.Views.maps = new FoursquareSearch.Views.Maps()
    @model = new FoursquareSearch.Models.Map()
    #originForm = new Traveltime.Views.ShapesOriginForm(model: model, map: Traveltime.Views.map)
    newSearch = new FoursquareSearch.Views.SearchNew(model: model, map: FoursquareSearch.Views.maps)

And this HTML

  <div id="top"></div>  
  <div id="sidebar">

  </div>

Init code:

window.FoursquareSearch =
  Models: {}
  Collections: {}
  Views: {}
  Routers: {}
  init: -> 

    new FoursquareSearch.Routers.Maps()
    Backbone.history.start()

$(document).ready ->
  FoursquareSearch.init()

I can see the console.log message however the HTML class / id does not get updated!

If I run:

$this = $('#sidebar')
$this.html('<p>All new content. <em>You bet!</em></p>')

in console I can see the HTML change on the page, it just seems that Backbone.js does not want to update the view for me?

Upvotes: 0

Views: 444

Answers (1)

Blake B
Blake B

Reputation: 138

Update @render to be @render() in your initialize method. You are simply returning the method, but never calling it.

Upvotes: 1

Related Questions