CODEWITHSUNDEEP
jquerywordpressdatepicker
Luis Gil
Luis Gil

Reputation: 3

remove specific months from Datepicker

In wordpress i'm trying to remove specific months in datepicker, but my code it's not working.

    invalidMonths = [11,12,1,2];

function noInvalidMonths(date) {
    if(jQuery.inArray(date.getMonth()+1, invalidMonths)>-1){
        return [false, '']
    }
    return [true, ''];

}
jQuery(function($) {
    $("#date1").datepicker({
        minDate: 0,
        maxDate: null,
        dateFormat: 'MM dd, yy',
        beforeShowDay: noInvalidMonths
    });
});

Upvotes: 0

Views: 282

Answers (2)

Outsource WordPress
Outsource WordPress

Reputation: 3799

Change like this. Note the increment of the month in the code, else you need to define as 'month-1' in the invalidMonths array.

var invalidMonths = [11,12,1,2];

function noInvalidMonths(date) 
{
    var month = eval(date.getMonth()+1); //increment by 1 since the months start from 0

    if (jQuery.inArray(month, invalidMonths) != -1) {
         return [false];
     }
     return [true];    
}

jQuery(function($) {
    $("#date1").datepicker({
        minDate: 0,
        maxDate: null,
        dateFormat: 'MM dd, yy',
        beforeShowDay: noInvalidMonths
    });
});

UPDATE: Deactivate your 'Contact Form 7 Datepicker' plugin, change both the 'datepickers' in your contact form to just 'text' boxes. Add the following to your theme's 'functions.php'.

function wp_custom_enqueue_datepicker() {
    // Load the datepicker script (pre-registered in WordPress).
    wp_enqueue_script( 'jquery-ui-datepicker', array( 'jquery' ) );
    wp_register_style('jquery-ui', 'http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css');
    wp_enqueue_style( 'jquery-ui' );   

    wp_add_inline_script( 'jquery-ui-datepicker', 'var invalidMonths = [11,12,1,2];  function noInvalidMonths(date)  {     var month = eval(date.getMonth()+1);   if (jQuery.inArray(month, invalidMonths) != -1) {          return [false];      }      return [true];     }  jQuery(function($) {     $("#date1,#date2").datepicker({         minDate: 0,         maxDate: null,         dateFormat: \'MM dd, yy\',         beforeShowDay: noInvalidMonths     });        var $date1 = $(\'#date1\'), $date2 = $(\'#date2\');     $date1.datepicker(\'option\', \'onSelect\', function(value){       $date2.datepicker(\'option\', \'minDate\', value);     }); });' );
}
add_action( 'wp_enqueue_scripts', 'wp_custom_enqueue_datepicker' );

Upvotes: 0

dipmala
dipmala

Reputation: 2011

Change your function with following code,

function noInvalidMonths(date) 
{
    var month = date.getMonth();
    if (jQuery.inArray(month, invalidMonths) != -1) {
         return [false];
     }
     return [true];    
  }

Hope this will help you.

Upvotes: 0

Related Questions