MovieList.Views.Searchbox = Backbone.View.extend({
    template: _.template($('#tmpl-search').html()),

    events: {
        'keyup input[name="titlefilter"]': _.debounce(function (ev) {
            this.model.set("titlefilter", ev.currentTarget.value);

        }, 300),
        'change input[name="watchedfilter"]': function (ev) {
            this.model.set("watchedfilter", ev.currentTarget.checked);
        },

        // Hide the menubar when the checkbox is clicked
        'click input[name="watchedfilter"]': function(ev) {
            $('.navbar-toggle:visible').click();
        },

        // Hide the menubar when pressing <enter> in the searchbox
        // XXX Maybe the `blur` event would be more helpful here. Try later.
        'keypress input[name="titlefilter"]': function(ev) {
            if (ev.which === 13) {
                $('.navbar-toggle:visible').click();
            }
        },
    },

    modelTemplateData: function() {
        return {
            titlefilter: this.model.get("titlefilter"),
            watchedfilter: this.model.get("watchedfilter") ? "checked" : "",
        };
    },

    render: function() {
        var html = this.template(this.modelTemplateData());
        this.$el.html(html);
        return this;
    }
});

MovieList.Views.Searchbox = Backbone.View.extend({
    template: _.template($('#tmpl-search').html()),

    events: {
        'keyup input[name="titlefilter"]': _.debounce(function (ev) {
            this.model.set("titlefilter", ev.currentTarget.value);

        }, 300),
        'change input[name="watchedfilter"]': function (ev) {
            this.model.set("watchedfilter", ev.currentTarget.checked);
        },

        // Hide the menubar when the checkbox is clicked
        'click input[name="watchedfilter"]': function(ev) {
            $('.navbar-toggle:visible').click();
        },

        // Hide the menubar when pressing <enter> in the searchbox
        // or clicking 'Done' in the keyboard
        'blur input[name="titlefilter"]': function(ev) {
            $('.navbar-toggle:visible').click();
        },
    },

    modelTemplateData: function() {
        return {
            titlefilter: this.model.get("titlefilter"),
            watchedfilter: this.model.get("watchedfilter") ? "checked" : "",
        };
    },

    render: function() {
        var html = this.template(this.modelTemplateData());
        this.$el.html(html);
        return this;
    }
});

Watch for the `blur` event instead of `keypress`
Watch for the `blur` event instead of `keypress`

Pressing "Done" on iOS7 is not triggering an <enter> keypress.
