0

I already have functioning code in jQueryUiDatepicker that disables Fridays and Saturdays and all previous days (plus 2 days). My issue is trying to add 2 specific dates to this existing Datepicker code that will also disable these dates.

This is my existing code on starting line 92 in jQueryUiDatepicker:

beforeShowDay: function(date) {
var show = true;
if(date.getDay()==5||date.getDay()==6) show=false
return [show];
},
    beforeShow: function(){
    var dateTime = new Date();
    var hour = dateTime.getHours();
    //If Hour is greater or equals to 8AM
    if(hour  >= 08){
        //Disable all past days including tomorrow and today
        $(this).datepicker( "option", "minDate", "+2" );
    }
},

I am trying to disable 18th and 19th October 2017 and failing, this is the code I have added directly underneath the above code:

beforeShowDay: var array = ['18/10/2017', '19/10/2017']

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

My question is how can I disable all previous dates, all Fridays and Saturdays and these 2 dates in the October?

Note# This coding has to be done in jquery.ui.datepicker, not a script in html

Community
  • 1
  • 1
Michael Joseph
  • 115
  • 1
  • 3
  • 13

1 Answers1

1

Hope this helps

use inArray instead of indexOf and you can also disable all previous dates using minDate

var array = ["18/10/2017", "19/10/2017"];
$(function() {
    $('input').datepicker({
        minDate: new Date(),
        beforeShowDay: function (date) {
        $thisDate = date.getDate() + "/" + (date.getMonth() + 1) + "/" + date.getFullYear();
    var day = date.getDay();
    if ($.inArray($thisDate, array) == -1&&day!=5&&day!=6) {
        return [true, ""];
    } else {
        return [false, "", "Unavailable"];
    }
}
    });
});

DEMO

Amal
  • 3,398
  • 1
  • 12
  • 20
  • Hi Amal, altough I can see your example works perfectly well in your fiddle I cannot get your code to work within jquery-ui-datepicker. I've tried a straight replacement with my code (supplied in initial question) and I've tried to chop and change it but whichever way I dice it its just not functioning. I know it can be done without using an external javascript and html but at the moment I'm still looking for this solution. I think to do this all the code has to come after beforeShowDay. – Michael Joseph Sep 21 '17 at 14:57
  • Hi Michael, can you replicate above mentioned issue in jsfiddle with your jquery ui plugins.I think the bug is due to your plugins. – Amal Sep 21 '17 at 15:32