0

I have updated my question please look at the updated part:

I am using rails-backbone gem in rails 4 and i followed a simple example presented on github's page of the gem. Backbone.js is now working fine but when i press browser back button to move back to see my all list of posts then nothing is displayed. It works fine when i press back link that is generated by scaffold. I will write the steps below:

rails new demo34
// Edit your Gemfile and add

gem 'rails-backbone'
// Install the gem and generate scaffolding.

bundle install
rails g backbone:install
rails g scaffold User title:string content:string
rails g backbone:scaffold User title:string content:string
rake db:migrate

In my app/views/users/index.html.erb with the following contents:

<div id="users"></div>

<script type="text/javascript">
  $(function() {
    // Blog is the app name
    window.router = new Demo34.Routers.UsersRouter({users: <%= @users.to_json.html_safe -%>});
    Backbone.history.start();
  });
</script>

Backbone.js is now working fine but when i press browser back button to move back to see my all list of posts then nothing is displayed. It works fine when i press back link that is generated by scaffold.

My users_router.js.coffee is as follows:

class Demo34.Routers.UsersRouter extends Backbone.Router
  initialize: (options) ->
    @users = new Demo34.Collections.UsersCollection()
    @users.reset options.users

  routes:
    "new"      : "newUser"
    "index"    : "index"
     ":id/edit" : "edit"
      ":id"      : "show"
    ".*"        : "index"

  newUser: ->
    @view = new Demo34.Views.Users.NewView(collection: @users)
    $("#users").html(@view.render().el)

  index: ->
    @view = new Demo34.Views.Users.IndexView(users: @users)
    $("#users").html(@view.render().el)

  show: (id) ->
    user = @users.get(id)

    @view = new Demo34.Views.Users.ShowView(model: user)
    $("#users").html(@view.render().el)

  edit: (id) ->
    user = @users.get(id)

    @view = new Demo34.Views.Users.EditView(model: user)
    $("#users").html(@view.render().el)

UPDATE:

Using the following code I got it working for back button for page change events by backbone and turbolinks. Now my backbone texts don't disappear while pressing back buttons. But there is a problem with page load event also Let me explain with an example what i mean below my code:

 $(document).on ('page:change', function(){

    Backbone.history.stop();
     Backbone.history.start();
     });

I do the following:

  1. localhost:3000 (Welcome aboard, you are riding ruby on rails page appears)

  2. localhost:3000/posts (backbone triggers its index.jst.ejs template)

  3. clicking new post then route changes to localhost:3000/posts#/new (new.jst.ejs)

  4. clicking create post button then route changes to localhost:3000/posts#/id (`show.jst.ejs')

  5. Now clicking on browsers back button route changes to localhost:3000/posts#/new (new.jst.ejs)

  6. clicking the back button again takes me to localhost:3000/posts (index.jst.ejs)

    Here I can see the new entry has been successfully entered.

  7. clicking the back button again takes me to localhost:3000 via reloading.

  8. on clicking forward button to go back to localhost:3000/posts (index.jst.ejs) i can see my entries still.

  9. Now if I destroy my entries and go back to localhost:3000 and come back we will see that the entries are not destroyed.

chaitanya90
  • 697
  • 2
  • 8
  • 24

0 Answers0