1
votes

Datepicker

<script type="text/javascript">
        var array = ["2015-11-25", "2015-11-27", "2015-11-29"]

        $(function () {
            $(".datepicker").datepicker({ beforeShowDay: $.datepicker.noWeekends, minDate: 0 })
            //$("#startDate").datepicker({ minDate: new Date(), beforeShowDay: $datepicker.noWeekends });
            $("#startDate").datepicker();
        });

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

       $(function () { $('#startDate').datepicker({ beforeShowDay: $.datepicker.noWeekends }); });
    </script>

Html

                <div class="form-group">
                    <div class="col-md-4 col-md-offset-4">
                        <label>Start Date</label>
                        @*<input type="date" class="form-control" id="startDate"/>*@
                        @Html.TextBox("datetime.now", String.Format("{0:d}", "Start date"), new { @class = "datepicker", type = "text" })
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-md-4 col-md-offset-4">
                        <br />
                        <label>End Date</label>
                        @*<input type="date" class="form-control" id="endDate" />*@
                        @Html.TextBox("01-01-2015", String.Format("{0:d}", "End date"), new { @class = "datepicker", type = "text" })
                    </div>
                </div>

Trying to use datepicker to disallow weekends and specific dates in the array from being selected. How do I combine both? Because currently only the noWeekends is working. Dates in my array are only disallowed from being selected when i comment out the noWeekends part.

3

3 Answers

0
votes

Just change your Script tag as follow and it should work.

 <script type="text/javascript">
    var array = ["2015-11-25", "2015-11-27", "2015-11-29"]
    $('.datepicker').datepicker({
        beforeShowDay: function (date) {
            var noWeekend = $.datepicker.noWeekends(date);
            if (noWeekend[0]) {
                return [array.indexOf(jQuery.datepicker.formatDate('yy-mm-dd', date)) == -1]
            } else {
                return noWeekend;
            }
        }, minDate: 0
    });
   $(function () { $('#startDate').datepicker({ beforeShowDay: $.datepicker.noWeekends }); });
</script>
6
votes
var holidays_dates = ["11-25-2015", "11-27-2015", "11-29-2015","10-9-2015"];
 $(function() {
 $( "#startDate" ).datepicker({
    beforeShowDay: function(date){
            // First convert the date in to the mm-dd-yyyy format 
            // Take note that we will increment the month count by 1 
             var current_date = (date.getMonth() + 1) + '-' + date.getDate() + '-' + date.getFullYear() ;
 //alert(current_date)
             // We will now check if the date belongs to    holidays_dates array 
             if ($.inArray(current_date, holidays_dates) != -1 ) {
                 return [false];
             } 
             // In case the date is not present in holidays_dates array, we will now check if it is a weekend. 
             // We will use the noWeekends function
             var weekend_dates = $.datepicker.noWeekends(date);
             return weekend_dates; 
         }
         });
 });
0
votes

Try:

var disableddates = ["11-25-2015", "11-27-2015", "11-29-2015"];

function DisableSpecificDates(date) {

    var m = date.getMonth();
    var d = date.getDate();
    var y = date.getFullYear();

    var currentdate = (m + 1) + '-' + d + '-' + y;
    for (var i = 0; i < disableddates.length; i++) {
        if ($.inArray(currentdate, disableddates) != -1) {
            return [false];
        }
    }

    var weekenddate = $.datepicker.noWeekends(date);
    return weekenddate;

}


$(function() {
    $('#startDate').datepicker({
        beforeShowDay: DisableSpecificDates
    });
});

Source: http://www.spiceforms.com/blog/how-to-disable-dates-in-jquery-datepicker-a-short-guide/

Fiddle: http://jsfiddle.net/6yajfmk2/1/