Backbone with TB2 modal sample View class

gistfile1.js

    ZPCommon.Views.SocialSharesView = Backbone.View.extend({
        template: 'public/common/socialShares_hb',
        id: 'socialShares',
        className: 'buttonBox',
        initialize: function() {
            _.bindAll(this, 'emailShare');
        },
        events: {
            'click #emailShareBtn': 'emailShare'
        },
        emailShare: function(e) {
            e.preventDefault();
            $('#emailShareModal').modal('show');
        }
    });

So the problem is that TB modals have machinery that wire in event handlers, and I'm wondering if that's conflicting with the view code. I'd do some tracing to see what code is getting the click.

It goes directly into twitter-bootstrap.js. The modal shows, but is immediately replaced with a full page load.

The link I have for the user is like this:

 <a href="#emailShareModal" id="emailShareBtn" class="btn_emailShare" data-toggle="modal" data-backdrop="true" data-keyboard="true"><img src="LargeIcons-Email.png" alt=""></a>

After clicking the browser URL shows as http://example-acme.localhost:9300/emailShareModal. This seems strange since the original href is #emailShareModal (that is, a relative path) and selecting copy URL from the browser context menu shows the link on the page has an href of:

http://example-acme.localhost:9300/campaigns/552/reviews/86459#emailShareModal

Note that I only know the modal loads and is briefly visible is from stepping through code with Firebug, otherwise the changes happen so fast the modal isn't seen.

Is that #emailShareModal triggering a route?

Shouldn't be, we have very few routes and none have a hash at the start. Also, I would have expected the preventDefault() to block that.

Bill, I figured it out. Hard to say what I was doing wrong but mainly because I'm still learning how Backbone fires and responds to events in Views. Thanks for chiming in.