Bootstrap datepicker - 可选择日期之间的范围

时间:2017-01-25 07:21:17

标签: jquery twitter-bootstrap datepicker range

我有两个具有相同禁用日期的相同日历,我需要计算可选择日期之间的范围。如何检测日期未启用?

这是我的用户界面:

enter image description here

T 他是我的引导程序DatePicker的所有代码:

      $("#holidayDateFrom").datepicker({
        format: 'dd/mm/yyyy',
        autoclose: true,
        language: 'bg',
        weekStart: 1,
        calendarWeeks: true,
        todayHighlight: true,
        //datesDisabled: datesForDisable,
        //daysOfWeekDisabled: [0, 6],
        beforeShowDay: function (currentDate) {
            var dayNr = currentDate.getDay();
            //you can access your array through the function's scope 
            if (dayNr == 6 || dayNr  == 0) {//you can  condition this with your  own logic
                return false;
            }  
       })
    .on('changeDate', function (e) {
        // Revalidate the date field
        $("#addHoliday_form").bootstrapValidator('revalidateField', 'holidayDateFrom');
        if ($("#holidayDateToValue").val()) {
            $("#addHoliday_form").bootstrapValidator('revalidateField', 'holidayDateTo');
        }
    });

2 个答案:

答案 0 :(得分:0)

        $(function()
        {
            function nationalDays(date)
            {

                var dis=["01/14/2017","01/26/2017","03/13/2017","07/25/2017","08/07/2017","08/14/2017","08/15/2017","09/30/2017"];
                var i=jQuery.datepicker.iso8601Week(new Date(date));
                var day=date.getDay(0,6);
                var disable=true;
                if(day==0)
                {
                    return false;
                }
                if(i%2==0)
                {
                    if(day==6)
                    {
                        return disable;
                    }
                }
                   var string = jQuery.datepicker.formatDate('mm/dd/yy', date);
                    return [ dis.indexOf(string) == -1 ]
             }
            $( "#date1" ).datepicker({
                minDate:0,
                dateFormat:'dd/mm/yy',
                firstDay:1,
                beforeShowDay:nationalDays
            });
            $( "#date2" ).datepicker({minDate:0,
                dateFormat:'dd/mm/yy',
                 firstDay:1,
             beforeShowDay: nationalDays
            });

            // Fullday  24*60*60*1000; hours*minutes*seconds*milliseconds       
            $('#fullday').click(function()
            {
                var start = $('#date1').datepicker('getDate');
                var end = $('#date2').datepicker('getDate');
                var weekend_count = 0;
                var firstday = new Date(start);
                var backday = new Date(end);
               var disable = ["01/14/2017","01/26/2017","03/13/2017","06/25/2017","08/07/2017","08/14/2017",
                "08/15/2017","09/30/2017","10/02/2017","10/19/2017","10/20/2017","12/25/2017"];

                var holiday;
                for (i = firstday.valueOf(); i <= backday.valueOf(); i+= 86400000) {
                    //alert(i);
                    var temp = new Date(i);

                      for(j=0;j<disable.length;j++)
                        {
                            holiday=disable[j];
                            if(!(temp < new Date(holiday))&& !(temp > new Date(holiday)))
                            {
                                weekend_count++;
                            }
                        }
                            if (temp.getDay() == 0  || (temp.getDay() == 6)) 
                            {
                                weekend_count++;
                            }
                }

                var total = ((backday - firstday) / 86400000+1 - weekend_count);
                var total_1dp = total.toFixed(1);        
                $('#daycount').val(total_1dp);
            });
            // Half Day
            $('#halfday').click(function()
            {
                var firstday = $('#date1').datepicker('getDate');
                var backday = $('#date2').datepicker('getDate');
                var weekend_count = 0;
                for (i = firstday.valueOf(); i <= backday.valueOf(); i+= 43200000) {
                    var temp = new Date(i);
                    if (temp.getDay() == 0 || temp.getDay() == 6) {
                        weekend_count++;
                    }
                }
                var total = ((((backday - firstday) / 86400000) - weekend_count)/2)+.5;
              var total_1dp = total.toFixed(1);


                $('#daycount').val(total_1dp);
            });

            });

//在此次通话中,我禁用基于印度语calander的假期

答案 1 :(得分:0)

由于你使用的是moment.js,你可以计算范围日期之间的日期。

请在下面找到工作小提琴样本。

Fiddle

    var enumerateDaysBetweenDates = function(startDate, endDate) {
    var dates = [];

    var currDate = startDate.clone().startOf('day');
    var lastDate = endDate.clone().startOf('day');
        dates.push(currDate.clone().toDate());
    while(currDate.add('days', 1).diff(lastDate) < 0) {
       // console.log(currDate.toDate());
        dates.push(currDate.clone().toDate());
    }
    dates.push(currDate.clone().toDate());
    return dates;
};

此函数将返回范围内的日期。

更新

对于禁用日,请找到更新的小提琴。

假设范围开始日不是禁用日。

Updated Fiddle

- 帮助:)