Skip to content

Instantly share code, notes, and snippets.

@kjs3
Created October 6, 2012 05:02
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
Star You must be signed in to star a gist
Save kjs3/3843944 to your computer and use it in GitHub Desktop.
Backbone code that's rendering one of the models 4 extra times.
# config file
window.App =
Models: {}
Collections: {}
Routers: {}
Views: {}
init: ->
@service_providers = new App.Collections.ServiceProvidersCollection()
@service_providers.fetch
success: ->
App.serviceProviderRouter = new App.Routers.ServiceProvidersRouter()
Backbone.history.start(pushState: true)
window.document.addEventListener 'click', (e) ->
e = e or window.event
target = e.target or e.srcElement
if target.nodeName.toLowerCase() is 'a'
e.preventDefault()
uri = target.getAttribute('href')
App.serviceProviderRouter.navigate(uri.substr(1), true)
window.addEventListener 'popstate', (e) ->
App.serviceProviderRouter.navigate(location.pathname.substr(1), true)
$(document).ready ->
App.init()
# router
class App.Routers.ServiceProvidersRouter extends Backbone.Router
routes:
"service_providers/:name_url" : "show"
"service_providers" : "index"
"service_providers/" : "index"
initialize: ->
@service_providers = App.service_providers
index: ->
@view = new App.Views.ServiceProviders.IndexView(service_providers: @service_providers)
$("#service_providers").html(@view.render().el)
show: (name_url) ->
@model = @service_providers.where(name_url: name_url)[0]
@view = new App.Views.ServiceProviders.ShowView(model: @model)
$("#service_providers").html(@view.render().el)
# index view
App.Views.ServiceProviders ||= {}
class App.Views.ServiceProviders.IndexView extends Backbone.View
template: JST["backbone/templates/service_providers/index"]
initialize: ->
addAll: () =>
@options.service_providers.each(@addOne)
addOne: (serviceProvider) =>
view = new App.Views.ServiceProviders.ServiceProviderView({model : serviceProvider})
@$("div").append(view.render().el)
render: =>
$(@el).html(@template(service_providers: @service_providers ))
@addAll()
return this
# service_provider.jst.ejs
<div class='provider'>
<h5>
<a href='/service_providers/<%= name_url %>'><%= name %></a>
</h5>
<p>
Industries: <%= industry_list %>
</p>
</div>
<div class='.cf'></div>
# index.jst.ejs
# just has this on opening div
# I was left with 2 closing divs if I closed this
<div class='providers'>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment