Prevent backbone event from firing

Question

I have a basic form with a backbone view, when I press enter on the top input the open event is fired. How can I ensure that the open event only fires when I press the browse button?

<form method="post">
    <div>
        <input type="text" />
    </div>
    <div id="myId">
        <input type="text" />
        <button class="browse">Browse...</button>
    </div>
    <input type="submit" value="Save" />
</form>

var MyView = Backbone.View.extend({

    events: {
        'click button.browse': 'open'
    },

    open: function(e) {
        alert('Open dialog');
    },

    initialize: function() {},

    render: function() {}
});

$(function() {
    var myView= new MyView({ el: $('#myId') });
});

jsFiddle here

Esailija · Accepted Answer · 2012-11-04T12:35:52.713

3

You need to specify type="button", otherwise it defaults to submit, and hitting enter on an textbox input in a form triggers submit...

http://jsfiddle.net/PJhED/40/

    <button class="browse" type="button">Browse...</button>

edited Nov 04 '12 at 12:35

answered Nov 04 '12 at 12:28

Esailija

138,174
23
272
326

I think you misunderstood, if you select the first input and then press enter, the open event is fired, I don't want that to happen. – marcus Nov 04 '12 at 12:31
@Marcus ah I get it. That's weird that it happens, let me think about it. – Esailija Nov 04 '12 at 12:33

score 1 · Answer 2 · answered Nov 04 '12 at 12:40

1

Change it to <button class="browse" type="button">Browse...</button>

http://jsfiddle.net/2Rt6p/1/

answered Nov 04 '12 at 12:40

Lumberjake

11
1

Prevent backbone event from firing

2 Answers2