简体   繁体   English

试图弄清楚如何从jquery datepicker中删除假期

[英]Trying to figure out how to strip holidays from jquery datepicker

Question is I want to be able to strip certain dates(holidays) from my jquery datepicker. 问题是我希望能够从我的jquery datepicker中剥离某些日期(假日)。 noWeekends works and so does my other custom variable to determine my new_day variable but, for some reason I cant get my holidays variable to work and to disable a user from clicking on an holiday dates. noWeekends可以正常工作,而其他自定义变量也可以确定我的new_day变量,但是由于某些原因,我无法使假期变量正常工作,并且无法使用户单击假期日期。 Any help would be greatly appreciated. 任何帮助将不胜感激。

extra info 额外信息

app using 应用使用

rails 4 + jquery Rails 4 + jQuery

Here is my application.js 这是我的application.js

$(document).ready(function(){

     var holidays = ["12-25-2015","2015-04-03", "2015-05-25", "2015-07-03", "2015-09-07", "2015-11-26", "2015-12-25", "2016-01-01"];
     function editDays(date) {
         for (var i = 0; i < holidays.length; i++) {
            if (new Date(holidays[i]).toString() == date.toString()) {
                return true;
            }
         }
           return false;
     }

     $.datepicker.setDefaults({ dateFormat: 'D, dd M yy', numberOfMonths: 3, showButtonPanel: true, beforeShowDay: editDays });


     $('#leave_start').datepicker();

     $('#leave_end').datepicker();

     $('#leave_start_half').datepicker();

     $('#leave_end_half').datepicker();

     $('#future').blur(function() {
        var selected = $('.future').val();
        var touched = $('#indirect_id').val();
        var new_day = $('.anv').val();
        if (selected == 'YES') {
           $('#leave_start').datepicker( "option", "minDate", new_day );
           $('#leave_start').datepicker( "option", "beforeShowDay", $.datepicker.noWeekends );
           $('#leave_end').datepicker( "option", "minDate", new_day );
           $('#leave_end').datepicker( "option", "beforeShowDay", $.datepicker.noWeekends );
           $('#leave_start_half').datepicker( "option", "minDate", new_day );
           $('#leave_start_half').datepicker( "option", "beforeShowDay", $.datepicker.noWeekends );
           $('#leave_end_half').datepicker( "option", "minDate", new_day );
           $('#leave_end_half').datepicker( "option", "beforeShowDay", $.datepicker.noWeekends );

        } else if (selected == 'NO') {
           $('#leave_start').datepicker( "option", "minDate", 0 );
           $('#leave_start').datepicker( "option", "beforeShowDay", $.datepicker.noWeekends );
           $('#leave_end').datepicker( "option", "minDate", 0 );
           $('#leave_end').datepicker( "option", "beforeShowDay", $.datepicker.noWeekends );
           $('#leave_start_half').datepicker( "option", "minDate", 0 );
           $('#leave_start_half').datepicker( "option", "beforeShowDay", $.datepicker.noWeekends );
           $('#leave_end_half').datepicker( "option", "minDate", 0 );
           $('#leave_end_half').datepicker( "option", "beforeShowDay", $.datepicker.noWeekends );

        }

     });
 });

I tried the answer that was given it worked but when the user selected 'YES' or 'NO' for my selected variable it took away holiday variable and re formatted datepicker back to this 我尝试了给出的答案,但是当用户为我选择的变量选择“是”或“否”时,它拿走了假日变量并重新格式化为日期选择器

      $('#leave_start').datepicker( "option", "minDate", new_day);                             
      $('#leave_start').datepicker( "option", "beforeShowDay", $.datepicker.noWeekends );

but when they leave the my selected variable this works but as soon as they select yes or no holiday variable disappears. 但是当他们离开我选择的变量时,此方法有效,但是一旦选择“是”或“否”,假日变量就会消失。

this is what I have now that works but only works if selected var is blank and not YES or NO 这就是我现在可以使用的东西,但是仅当选择的var为空且不是YES或NO时才起作用

$(document).ready(function(){
    var holidays = ["12-25-2015","2015-04-03", "2015-05-25", "2015-07-03", "2015-09-07", "2015-11-26", "2015-12-25", "2016-01-01"];
     $.datepicker.setDefaults({ dateFormat: 'D, dd M yy', numberOfMonths: 3, showButtonPanel: true, beforeShowDay: function(date){
        var string = jQuery.datepicker.formatDate('yy-mm-dd', date);
        return [ holidays.indexOf(string) == -1 ]
      }});

     $'#leave_start').datepicker();

     $('#leave_end').datepicker();

     $('#leave_start_half').datepicker();

     $('#leave_end_half').datepicker();

     $('#future').blur(function() {
         var selected = $('.future').val();
         var touched = $('#indirect_id').val();
         var new_day = $('.anv').val();

         if (selected == 'YES') {
            $('#leave_start').datepicker( "option", "minDate", new_day );
            $('#leave_start').datepicker( "option", "beforeShowDay", $.datepicker.noWeekends );
            $('#leave_end').datepicker( "option", "minDate", new_day );
            $('#leave_end').datepicker( "option", "beforeShowDay", $.datepicker.noWeekends );
            $('#leave_start_half').datepicker( "option", "minDate", new_day );
            $('#leave_start_half').datepicker( "option", "beforeShowDay", $.datepicker.noWeekends );
            $('#leave_end_half').datepicker( "option", "minDate", new_day );
            $('#leave_end_half').datepicker( "option", "beforeShowDay", $.datepicker.noWeekends );

       } else if (selected == 'NO') {
            $('#leave_start').datepicker( "option", "minDate", 0 );
            $('#leave_start').datepicker( "option", "beforeShowDay", $.datepicker.noWeekends );
            $('#leave_end').datepicker( "option", "minDate", 0 );
            $('#leave_end').datepicker( "option", "beforeShowDay", $.datepicker.noWeekends );
            $('#leave_start_half').datepicker( "option", "minDate", 0 );
            $('#leave_start_half').datepicker( "option", "beforeShowDay", $.datepicker.noWeekends );
            $('#leave_end_half').datepicker( "option", "minDate", 0 );
            $('#leave_end_half').datepicker( "option", "beforeShowDay", $.datepicker.noWeekends );

       }

     });
 });

A sample workaround for a single input date: 单个输入日期的解决方法示例:

DEMO HERE 此处演示

$('input').datepicker({
    beforeShowDay: function(date){
        var string = jQuery.datepicker.formatDate('yy-mm-dd', date);
        return [ holidays.indexOf(string) == -1 ]
    }
});

SOURCE 资源

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM