如何在不单击“应用”按钮的情况下设置选择值

Question

我想在用户选择日期范围时更改值

如果用户离开弹出窗口而忘记单击“应用”按钮，

应保存该值而不会丢失。

我怎么能这样做，谢谢〜

的javascript

:javascript
  $(document).ready(function() {
    var days_of_week =$.parseJSON('#{escape_javascript(t('date.abbr_day_names').to_json)}');
    $('#date-range-picker').daterangepicker(
      {
        locale: {
          daysOfWeek: days_of_week,
          applyLabel: "#{escape_javascript t('date_range_picker.apply')}",
          cancelLabel: "#{escape_javascript t('date_range_picker.cancel')}",
          fromLabel: "#{escape_javascript t('date_range_picker.depart_date')}",
          toLabel: "#{escape_javascript t('date_range_picker.return_date')}",
        },
        format: 'YYYY/MM/DD',
        dateLimit: { days: 30 }
      },
      function(start, end, label) {
        console.log(start.toISOString(), end.toISOString(), label);
      }
    );
  });

Answer 1

尝试更改（）方法

http://www.w3schools.com/jquery/event_change.asp

更改事件发生在元素的值更改时（仅适用于表单字段）。

Answer 2

我找不到为onSelect传递的选项，比如jQuery ui的日期选择器http://api.jqueryui.com/datepicker/#option-onSelect（我也推荐使用）但我可以告诉你一个hacky示例，如果你设置它可以使它工作使用daterangepicker。

// when a start date is clicked
$('.calendar.left .available').click(function(e) {

  // get the changed date from the input field on the calendar
  var selectedStartDate = $('[name="daterangepicker_start"]').val();

  // get current range to modify
  var currentRange = $('[name="daterange"]').val();

  // set new range value
  $('[name="daterange"]').val(rangeFromNewStart(selectedStartDate, currentRange);

  // close the dialog
  $('.daterangepicker').css('display', 'none');
});

function rangeFromNewStart(startValue, currentRange){
  startValue + ' -' + currentRange.split('-')[1];
};

然而正如我之前所说，你对jQuery ui有更大的灵活性。除此之外，这又是一个简单问题的hacky方法。如果您注意到，在此示例中，我只向您展示了如何更改开始日期。如果要修改结束日期，则必须使用正确的日历重现此功能。