How to disable backbone.js from adding /# when dialog is closed

Question

When I load my backbone page, and press back button it adds /# to the url. If I click back again it loads the empty index page from rails home view. I was able to resolve this issue by turning off turbolinks.

However, when I open any foundation.js dialog, it also appends same /# to the url. Now when I hit back instead of going to previous page it again loads empty rails home page instead of loading backbone page.

How can I prevent backbone from adding this /# hash.

My rails index page is:

<div class="containing_div"><div>
<%= javascript_tag do -%>
    (function () {
       MyApp.initialize();
    })();
<% end -%>

And my initialize function is:

  initialize: function(){
    this.private.biography = new MyApp.Models.BiographyModel();
    this.private.purposeModel = new MyApp.Models.PurposeModel();
    new MyApp.Routers.Welcome();
    if(!Backbone.History.started){
     Backbone.history.start();
    }
    this.initializeData();
  }

And my router is:

MyApp.Routers.Welcome = Support.SwappingRouter.extend({

    initialize: function(options){
        this.el = $('div.containing_div');
    },
    routes: {
        "": "index"
    },

    index: function(){
        var view = new MyApp.Views.WelcomeIndex();
        this.swap(view);
    }
})

And this is how I'm closing my modal:

$('#profileModal').foundation('reveal', 'close', {
    animation: 'none'
});

Answer 1

I guess that in order to open/close modal you are using , and that is default browser behaviour to switch to /#. You either should use regular (which, btw., can be used outside of ) or disable event propagating when clicking on .