I am working on a form for the public to select an available date for a service. I used the code laid out in this thread to restrict available dates (the service is only offered M, W, F), and added a lookup rule to the form that looks up a sql table with dates that have already been taken. The "blackoutDates hiddenField" drop down on the form uses the "Append choices to lookup results", and when I unhide the field I can see that the correct choices do appear in the drop down. So the lookup rule is working, but my calendar is not excluding the dates in the table. Below is what I have in my "CSS and JavaScript" section. It's like only the first half of line 30 is recognized.
I'm thinking it has something to do with the format of the date field in my lookup table. I have tried "date" type and "text", both have the same result.
//Create the array of blackout dates var blackoutDatesList = new Array(); //Run the function when the document loads $(document).ready(function(){ //Set the date range to only display available future dates for 180 days var today = new Date(); var startDate = new Date(); startDate.setDate(today.getDate() + 1); var endDate = new Date(); endDate.setDate(today.getDate() + 180); var minDate = $.datepicker.formatDate('yy-mm-dd', new Date(startDate)); var maxDate = $.datepicker.formatDate('yy-mm-dd', new Date(endDate)); $('.myLimitedDate input').attr('min', minDate); $('.myLimitedDate input').attr('max', maxDate); //loop through each date in the blackout date list, and add it to an array blackoutDatesList.length = 0; $('.blackoutDates option').each(function() { blackoutDatesList.push(formatDate(new Date($(this).val()))); }); //disable other dates on the picker that are not M, W, F or are in the blackout array //add validation setting for date format function isValidDate(n) { var t = n.getDay(); var d = n.getDate(); var string = jQuery.datepicker.formatDate('yy-mm-dd', n); return (t!=0 && t!=2 && t!= 4 && t!=6 && blackoutDatesList.indexOf(string) == -1); } function checkDate(n) { return[isValidDate(n),""]; } function checkField(input, inst) { if ($(input).closest('li').hasClass('myLimitedDate')) { $(input).datepicker("option", {beforeShowDay: checkDate}); } } $.datepicker.setDefaults( {beforeShow: checkField} ); window.Parsley.addValidator('limiteddate', { validateString: function(value) { //IMPORTANT! this date format needs to match the format you set for the field on the layout page return isValidDate(moment(value, "mm-DD-yyyy").toDate()); }, messages: { en: 'Not a valid date.' } }); $('.myLimitedDate input').attr('data-parsley-limiteddate',''); }); //this function is run when the lookups are completed. $(document).on("onloadlookupfinished", function () { //loop through each date in the blackout date list, and add it to an array blackoutDatesList.length = 0; $('.blackoutDates option').each(function() { blackoutDatesList.push(formatDate(new Date($(this).val()))); }); }); //function to return any date formatted as yyyy-mm-dd function formatDate(date) { var d = new Date(date), month = '' + (d.getMonth() + 1), day = '' + (d.getDate() +1), year = d.getFullYear(); if (month.length < 2) month = '0' + month; if (day.length < 2) day = '0' + day; return [year, month, day].join('-'); }