Requested Due Date No Weekends or Holidays Date Picker User Control - xmpie-users/uStore-js GitHub Wiki

Requested Due Date No Weekends or Holidays Date Picker

New Date Picker for Requested Due starting 3 days from today. Weekends and Holiday days are blocked. Holidays are configurable in an included JS file.

##Steps to create HTML Generic Input Control for a date picker popup with todays date of 10/29/21

b5e54112-45eb-466d-a078-4ca65939cbfe

###HTML Generic HTML code

<!-- DatePickerNoWeekendsHolidays v20211029_1626-->
<!--
 * @author XMPie Application Services
 * Custom Date Picker HTML Generic control
-->

  <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css">
  <!-- <script src="//code.jquery.com/jquery-1.12.4.js"></script>    Do Not Load jquery again, alrweady present in uStore -->
  <script src="//code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

  <script src="/uStore/Controls/DatePickerNoWeekendHolidays/HolidayDates.js"></script>
  <script src="/uStore/Controls/DatePickerNoWeekendHolidays/NewDatePickerSCRIPT.js"></script>

<table border="0" cellspacing="0" cellpadding="0">
<tbody>
  <tr valign="baseline">
    <td><div class="FormLabel" style="width: 190px;">#DIAL_DISPLAY_NAME#</div></td>
    <td><input id="newdatepicker" type="text" value="#DIAL_VALUE#" /></td>
  </tr>
</tbody>
</table>

###JS Include NewDatePickerSCRIPT.js

// NewDatePicker script for custom HTML Generic control
// based on https://api.jqueryui.com/datepicker/#entry-examples 
// @author XMPie Application Services
//
console.info('NewDatePicker START v20211029_1426');

//console.info('NewDatePicker holidaydates',holidaydates);

	holidays = [];
	holidays = holidaydates || "1.1.2022";
	//console.info('holidays',holidays)

    // dateMin is the minimum delivery date
    var today = new Date();
   
	//console.info('NewDatePicker > start dateMin', dateMin)
	
	function AddBusinessDays(curdate, weekDaysToAdd) {
		//console.info('AddBusinessDays curdate: "%s", weekDaysToAdd: "%s"', curdate.toLocaleDateString("en-US"), weekDaysToAdd)

		var offset = (weekDaysToAdd > 0 ? +1 : -1);
		//console.info('AddBusinessDays > offset:',offset)

		weekDaysToAdd = Math.abs(weekDaysToAdd);
		//console.info('AddBusinessDays > weekDaysToAdd:',weekDaysToAdd)

		var date = new Date(curdate.getTime());
		while (weekDaysToAdd > 0) {
			date.setDate(date.getDate() + offset);
	
			//check if current day is business day
			//console.info('is this business day ?  > date: "%s" noWeekendsOrHolidays(date): "%s" weekDaysToAdd: "%s"',date.toLocaleDateString("en-US"),noWeekendsOrHolidays(date)[0],weekDaysToAdd)

			if (noWeekendsOrHolidays(date)[0]) {   /// need to test first eleemnt in returned array
				// if not a weekend or holiday then decrement the days counter 
				weekDaysToAdd--;
			   //console.info('AddBusinessDays if YES date noWeekendsOrHolidays(date) weekDaysToAdd:', date.toLocaleDateString("en-US"), noWeekendsOrHolidays(date)[0],weekDaysToAdd)
			} else {
				// if is a weekend or holiday skip the day
			   //console.info('AddBusinessDays if NO  date noWeekendsOrHolidays(date) weekDaysToAdd:', date.toLocaleDateString("en-US"),noWeekendsOrHolidays(date)[0],weekDaysToAdd)
			}
		}
		//console.info('AddBusinessDays return date: "%s"', date.toLocaleDateString("en-US"))
		return date;
	}
	
	function noWeekendsOrHolidays(date) {
		// returns false (array?) if date is NOT a weekend or holiday day
		// returns true  (array?) if date IS a weekend or holdiay day
		let noWeekend = $.datepicker.noWeekends(date);
		let result = (noWeekend[0] ? holidayDays(date) : noWeekend)
		//console.info('noWeekendsOrHolidays > date: "%s" noWeekend: "%s" result: "%s"',date.toLocaleDateString("en-US"), noWeekend, result)
		return result;
	}
	
	function holidayDays(date) {
		var m = date.getMonth(), d = date.getDate(), y = date.getFullYear();
		//console.info('holidayDays > m d y ',m,d,y)
		for (i = 0; i < holidays.length; i++) {
			//console.info('holidays',holidays)
			  if($.inArray( (m+1) + '.' + d + '.' + y, holidays) != -1) { // hide if a holiday
				return [false, d + '_day'];
			}
		}
		return [true, ''];
	}

    const minDate =  AddBusinessDays(today, 3); // add number of days ahead of today to start
	console.info('NewDatePicker > minDate:',minDate)

	$( document ).ready(function() {
		console.info('docuemnt ready start $("#newdatepicker")',$('#newdatepicker'))
		$('#newdatepicker').datepicker({
		  dateFormat: "mm/dd/yy",
    	  firstDay: 0,
		  changeFirstDay: false,
		  minDate: minDate,
		  beforeShowDay: noWeekendsOrHolidays,
		  onSelect: function(date) {
			returnValue(date);
		  }
		});
	});


console.info('NewDatePicker END');

###JS Include HolidayDates.js


const holidaydates = ["11.25.2021","12.24.2021","01.1.2022","1.17.2022","5.5.2022","7.4.2022","9.5.2022","11.11.2022","11.24.2022","12.26.2022"];

###Place JS files in CustomerApp\Controls\DatePickerNoWeekendHolidays\

###Create HTML Generic with HTML code with function callback returnValue

(2)

Apply control to products as needed. The function script and holiday date are in filesystem files and included in the HTML for the control. Update to the holiday dates or the function will apply to all HTML Generic Input Controls with changes to the product setup.

⚠️ **GitHub.com Fallback** ⚠️