javascript - 将日期范围选择器开始日期设置为空白

标签 javascript jquery momentjs bootstrap-daterangepicker

我有一个基于 http://www.daterangepicker.com 的日期范围选择器的日期范围选择器,我想将开始日期设置为空。这将适用于我想做的事情。

我正在使用文本输入字段来获取日期

</span><input type="text" class="form-control" id="reservation" />

网站上有一个设置“Input Initially Empty”的示例,但我无法让它工作。基本上我不知道在哪里设置它。

我的日期范围选择器在一个局部 View 中,它被另一个 View 调用。页面脚本设置在调用局部 View 的 View 中。在 daterangepicker.js 脚本中,我发现了这些行;

//default settings for options
        this.parentEl = 'body';
        this.element = $(element);
        this.startDate = moment().startOf('day');
        this.endDate = moment().endOf('day');
        this.minDate = false;
        this.maxDate = false;
        this.dateLimit = false;
        this.autoApply = false;
        this.singleDatePicker = false;
        this.showDropdowns = false;
        this.showWeekNumbers = false;
        this.timePicker = false;
        this.timePicker24Hour = false;
        this.timePickerIncrement = 1;
        this.timePickerSeconds = false;
        this.linkedCalendars = true;
        this.autoUpdateInput = true;
        this.ranges = {};

据我所知,它们是基于 moment.js 的。我尝试操纵 this.startDate 但无法将其设置为空值。使用 this.startdate = null 使整个日期范围选择器停止工作,所以我想我需要类似 moment.js 的空日期等价物。或者完全不同的东西。

谁能告诉我怎么做?

最佳答案

输入最初为空

<input type="text" name="datefilter" value="" />

<script type="text/javascript">
$(function() {

  $('input[name="datefilter"]').daterangepicker({
      autoUpdateInput: false,
      locale: {
          cancelLabel: 'Clear'
      }
  });

  $('input[name="datefilter"]').on('apply.daterangepicker', function(ev, picker) {
      $(this).val(picker.startDate.format('MM/DD/YYYY') + ' - ' + picker.endDate.format('MM/DD/YYYY'));
  });

  $('input[name="datefilter"]').on('cancel.daterangepicker', function(ev, picker) {
      $(this).val('');
  });

});
</script>

//daterangepickers
            //moment.locale('tr');
            moment.locale("@SessionHelper.CurrentLanguageTwoChar");

            $(".date-control").daterangepicker({
                singleDatePicker: true,
                showDropdowns: true,                
                //timePicker: true,
                //timePicker24Hour: true,
                //timePickerSeconds: true,
                minYear: parseInt(moment().subtract(10, 'years').format('YYYY'),10),
                maxYear: parseInt(moment().add(10, 'years').format('YYYY'), 10),
                autoUpdateInput: false,                
                singleClasses: "",
                locale: {
                    //format: 'DD.MM.YYYY HH:mm:ss'
                    //format: 'DD.MM.YYYY'
                }
            });

            $('.date-control').on('apply.daterangepicker', function (ev, picker) {
                $(this).val(picker.startDate.format('L'));
            });

            $('.date-control').on('cancel.daterangepicker', function (ev, picker) {
                $(this).val('');
            });

http://www.daterangepicker.com/#example5

https://github.com/dangrossman/daterangepicker/issues/815

关于javascript - 将日期范围选择器开始日期设置为空白,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36251020/

相关文章:

javascript - 根据宽度更改 DIV 背景颜色

javascript - 如何使用 momentjs 和 javascript 将 maxDate 设置为日期选择器

javascript - unix-timestamp 和 ISO 时间之间的关系。他们为什么不平等?

javascript - 根据条件重置计数器变量

javascript - 将 momentjs 与重复日期一起使用

javascript - Phonegap 忽略空全局对象

jQuery 可拖动隐藏与 CSS3 多列

javascript - 退出 jQuery $.each 循环

javascript - 将现有函数声明为异步?

javascript - 生成日期并将新属性添加到对象数组中