Question

When I call fetch(), I receive more than one models @ client side. At first , I am able to show 1st model in a template. Now what I want is, On Button Click event, I need to show 2 nd model & so on in the same template.

I already tried to explain my question here Backbone.js [ Rendering a view on a click. / user action ].. but I guess its mis-interpreted.

Answer 1

Here is how I did it. Assuming that the model is a collection. This is in CoffeeScript, but you should get the idea:

class Diary.Views.Entries extends Backbone.View
  tagName: 'div'
  template: JST["backbone/templates/entry_index"]

  events:
    "click": "render_next"

  initialize: ->
    @model.bind("reset", @render)

  render: =>
    $(@el).html(@template(@model.toJSON()))
    @show_index = -1
    @render_next()
    this

  render_next: =>
    @show_index++
    return if @model.length <= @show_index
    @render_item @model.at(@show_index)

  render_item: (item) =>
    new_view = new Diary.Views.Entry(model: item)
    $(@el).find("#list").append(new_view.render().el)