Question

我有一个初始化jQuery UI datepicker的DateSelectorView，我添加了onSelect方法，该方法触发传递日期值的全局事件。我需要触发全局事件，但我还需要从我的视图中访问值，在我的视图中有'change input'事件虽然没有被确认为DateSelectorView onSelect陷阱它，任何人都可以推荐我如何解决这个问题？有没有办法触发全局事件，然后让DateSelectorView onSelect继续进行其他需要它的事件？

JS

App.Views.PersonView = Marionette.ItemView.extend({

    template: '.js-person-tmpl',

    events: {
        'change input': 'onSelect'
    },

    templateHelpers: function () {
        return {
            availableClasses: this.options.availableClasses.toJSON()
        }
    },

    initialize: function () {
        //console.log('PersonView::initialize', this.options, this.model.toJSON());
    },

    onRender: function() {
        this.dateSelector = new App.Views.DateSelectorView({
            el: this.$el.find('.js-date')
        });
    },

    onSelect: function() {
        console.log('date selected');

        // this.model.set('dateSelected', '');
    }
});

App.Views.DateSelectorView = Marionette.ItemView.extend({

    template: false,

    tagName: 'input',

    initialize: function() {
        //console.log('DateSelectorView::initialize');

        this.$el.datepicker({
            dateFormat: 'dd M yy',
            altFormat: 'yy-mm-dd',
            altField: '.js-date-hidden',
            showOtherMonths: true,
            selectOtherMonths: true,
            onSelect: function() {
                console.log('date:selected', this.value);

                Backbone.Events.trigger('date:selected', this.value);         
            }
        });
    }
});

JSFiddle： http://jsfiddle.net/kyllle/okmL8k8p/5/

Answer 1

这可以通过Backbone事件修复

App.Views.PersonView = Marionette.ItemView.extend({
   initialize: function () {
      App.events.on("doSomething_event", this.onSelect);
   },
   onSelect: function(date) {
      console.log(date);
   }
});

App.Views.DateSelectorView = Marionette.ItemView.extend({
     initialize: function() {
         this.$el.datepicker({
            dateFormat: 'dd M yy',
            altFormat: 'yy-mm-dd',
            altField: '.js-date-hidden',
            showOtherMonths: true,
            selectOtherMonths: true,
            onSelect: function() {
              App.events.trigger("doSomething_event", this.value);
            }
         });
     }
});

App.events = _.extend({}, Backbone.Events);

希望这会对你有帮助！

如何在onSelect中使用jQueryUI datepicker，还可以在Backbone视图中使用change事件？

1 个答案: