没有模型的Backbone.js datepicker事件监听器

时间:2013-11-08 19:44:34

标签: javascript jquery events backbone.js datepicker

我是骨干新手,我正在尝试创建一个日期选择器。我试图添加一个没有模型的事件监听器,但我在视图中添加的click事件监听器表现得很有趣,所以我假设我这样做错了。我试图模仿的代码(有效)如下:

initialize:function () {
    ...
    this.model.bind('change', this.pageSetup, this);
    ...
}

  pageSetup:function () {

    var self = this;

      $("#date-range").datepicker({
        onSelect:function (dateText, datePickeOBJ) {
          self.selectedDate = dateText;
          self.onDateChange(datePickeOBJ);
        },
        defaultDate: this.selectedDate,
        maxDate:'-2'
      });
    ...
 }

似乎工作正常。就我而言,没有模型。现在我有

return BaseView.extend({
  el: "<div id='main-inner'>",

  template: "print-report",
  events: {
      "change #date-range": "datePicker"
  }, ...
datePicker: function() {
 var self = this;

$("#date-range").datepicker({
        onSelect:function (dateText, datePickeOBJ) {
          self.selectedDate = dateText;
          self.onDateChange(datePickeOBJ);
        },
        defaultDate: this.selectedDate,
        maxDate:'-2'
      });
 }, ...

我怎么能更好地解决这个问题呢?

1 个答案:

答案 0 :(得分:3)

我只需在$.datepicker()上创建mouseover

events: {
  'mouseover #dateinput' : 'createDatePicker'
},

createDatePicker:function(e) {
  var view = this;

  $(e.currentTarget).datepicker({
    maxDate:'-2',
    defaultDate:view.selectedDate,
    onSelect:function(dateText,datePicker) {
      console.log('onSelect',dateText);
      view.selectedDate = dateText;
      view.onDateChange(datePicker);
    }
  });
}

这是demo