Question

Restrict Date Picker based on Time Variables.

Forms Web Customizations Version 10

Updated February 25, 2018

asked on May 22, 2017

I'm looking to restrict the date picker based on a the current time function of the time variable in Laserfiche 10.2, where if it is before noon, to restrict the date picker to only allow the current date, or future dates. If it is after noon, then restrict it to only allow the next day, or future dates.

I have a working setup using two different date fields, field rules, and two nearly identical sets of JavaScript. One datefield is using the CSS class of calendarDate and the other using calendarDate2.

Here's the JavaScript that is in place:

/* Restricts Date Picker from allowing current and past dates to be chosen */
$(function() {
  $(document).ready(function (){
   
    var todaysDate = new Date(); // Gets today's date
    var year = todaysDate.getFullYear(); 						// YYYY
    var month = ("0" + (todaysDate.getMonth() + 1)).slice(-2);	// MM
    var day = ("0" + (todaysDate.getDate() )).slice(-2);			// DD
    var minDate = (year +"-"+ month +"-"+ day); // Results in "YYYY-MM-DD" for tommorrow's date 
       
	// Now to set the max date value for the calendar to be today's date
    $('.calendarDate input').attr('min',minDate);
   });
});



/* Restricts Date Picker from allowing current and past dates to be chosen */
$(function() {
  $(document).ready(function (){
   
    var todaysDate = new Date(); // Gets today's date
    var year = todaysDate.getFullYear(); 						// YYYY
    var month = ("0" + (todaysDate.getMonth() + 1)).slice(-2);	// MM
    var day = ("0" + (todaysDate.getDate() +1 )).slice(-2);			// DD
    var minDate = (year +"-"+ month +"-"+ day); // Results in "YYYY-MM-DD" for tommorrow's date 
       
	// Now to set the max date value for the calendar to be today's date
    $('.calendarDate2 input').attr('min',minDate);
   });
});

My goal is to have just one date field, and then using the JavaScript, automatically choose the appropriate date restrictions based on if its before noon, or after.

Thanks for any help!

0 0

Answer

SELECTED ANSWER

replied on May 22, 2017

The semicolon after if (time.val() > noon) should be removed; and you need to trigger the calculation when time field changed so the fixed script is like this:

$(document).ready(function (){
  $('#Field25').change(function(){
    var time = $('#Field25');
    var noon = ("12:00:00");

    var todaysDate = new Date(); // Gets today's date
    var year = todaysDate.getFullYear(); 						// YYYY
    var month = ("0" + (todaysDate.getMonth() + 1)).slice(-2);	// MM

    if (time.val() > noon)
    {
      var day = ("0" + (todaysDate.getDate() +1 )).slice(-2);			// DD
    }
    else
    {
      var day = ("0" + (todaysDate.getDate() )).slice(-2);			// D
    };

    var minDate = (year +"-"+ month +"-"+ day); // Results in "YYYY-MM-DD" for tommorrow's date 

    // Now to set the max date value for the calendar to be today's date
    $('.calendarDate input').attr('min',minDate);
  });
});

2 0

replied on May 23, 2017

Fantastic as always. Thank you @████████!

0 0

Replies

replied on May 22, 2017 • Show version history

This is as close as I can get, for some reason the else is breaking it. (It allows any date to be chosen.)

/* Restricts Date Picker from allowing current and past dates to be chosen */
$(function() {
  $(document).ready(function (){
   
    var time = $('#Field25');
    var noon = ("12:00:00");
    
    var todaysDate = new Date(); // Gets today's date
    var year = todaysDate.getFullYear(); 						// YYYY
    var month = ("0" + (todaysDate.getMonth() + 1)).slice(-2);	// MM
    
    if (time.val() > noon);
    {
    	var day = ("0" + (todaysDate.getDate() +1 )).slice(-2);			// DD
    }
    else
    {
		var day = ("0" + (todaysDate.getDate() )).slice(-2);			// D
    };
    
    var minDate = (year +"-"+ month +"-"+ day); // Results in "YYYY-MM-DD" for tommorrow's date 
       
	// Now to set the max date value for the calendar to be today's date
    $('.calendarDate input').attr('min',minDate);
   });
});

If I comment out the else, I can turn the conditional either way (< or >) and it works, as long as the else is not a factor.

Thanks

0 0

replied on February 25, 2018

How to restrict a date based on another date entered in the same form. For eg. I have a form with two dates Start Date and End Date. I want to enter the End Date such that the date is after Start Date. All the date before Start Date should be disabled.

Thanks in advance.

0 0

replied on February 25, 2018

Solution Found

https://answers.laserfiche.com/questions/109445/How-to-restrict-date-picker-selection-based-on-the-entry-in-another-date-field#109448

0 0

You are not allowed to follow up in this post.

Question

Question

Restrict Date Picker based on Time Variables.

Answer

Replies

Sign in to reply to this post.