1
votes

Have the following view :

ContactsApp.SettingsView = Backbone.Marionette.ItemView.extend({
    initialize: function () {
        this.bindTo(this.model, "change", this.modelChanged);
    },
    modelChanged: function (model, value) {
        console.log(this.model.get('search'));
        this.render();
    },
    events: {
        'click .clickable': 'GoTo',
        'keyup input[type=text]': 'search'
    },
    GoTo: function (ev) {
        var dest = $(ev.target).data('dest');
        if (dest == undefined) { return; }
        if (dest === "next") { this.model.nextPage(); return; }
        if (dest === "prev") { this.model.previousPage(); return; }
        this.model.set({ page: dest });
    },
    search :  function (ev) {
        console.log('search');
    },
    template: "#additional-stuff-template"
});

And My Template :

<script type="text/template" id="additional-stuff-template">

    <span class="clickable" data-dest="1">First</span>&nbsp;  
    <span class="clickable" data-dest="prev">Previous</span>&nbsp;
     <input type="text" value="{{ page }}"  size="3" /> of {{ pages}} 
      <span class="clickable" data-dest="next">Next</span>&nbsp;
    <span class="clickable" data-dest="{{ pages }}">Last</span> &nbsp;
      Search : <input type="text" class="search" value="{{ search }}"  size="15" /> 
</script>

The events dont fire. if i change

events: {
    'click .clickable': 'GoTo',
    'keyup input[type=text]': 'search'
},

to

events: {
    'click': 'GoTo',
    'keyup': 'search'
},

I can get the click event to run but its not solely on the span's (had the same issue with anchor tags as well.

I know this is something stupid i am doing ...

1

1 Answers

1
votes

Turns out it wasnt something i was doing that was stupid.

It turns out that this can happen if you have

jquery.validate 1.5.5
and jquery 1.7.2 (there may be other versions that this effects this was just the one i had)

removing jquery.validate (which i wasnt using) made it start working again