form – limit datepicker

It is possible to customize the Toolset Forms datepicker limiting the date choice. For example, it could be useful to limit the choice from this day forward or from this day backward or just this month, etc.

Toolset uses jQuery datepicker API, here there are some examples how to use it in the Toolset Form JS editor:

From this day forward

(function($) {

  $(window).bind("load", function() {

    $(".js-wpt-date").datepicker("option", "minDate", 0 );

  });
})(jQuery);

From this day backward

(function($) {

  $(window).bind("load", function() {

    $(".js-wpt-date").datepicker("option", "maxDate", 0);

  });
})(jQuery);

Before 18 years ago

(function($) {

  $(window).bind("load", function() {

    $(".js-wpt-date").datepicker("option", "maxDate", "-18Y");

  });
})(jQuery);

Just this month

(function($) {

  $(window).bind("load", function() {

    function daysInMonth (month, year) {
      return new Date(year, month, 0).getDate();
    }

    $(".js-wpt-date").each(function() {

      var d = new Date();
      var day = d.getDate();
      var month = d.getMonth()+1;
      var year = d.getFullYear();
      var month_days = daysInMonth(month, year);

      var $minDate = -(day-1);
      var $maxDate = (month_days-day);

      $(this).datepicker("option", "minDate", $minDate);
      $(this).datepicker("option", "maxDate", $maxDate );

    });
  });
})(jQuery);

Disable the weekends

(function($) {

  $(window).bind("load", function() {

    $(".js-wpt-date").datepicker( "option", "beforeShowDay", jQuery.datepicker.noWeekends , );

  });
})(jQuery);

You can find more examples of datepicker API here:

https://codehasbug.com/javascript/disable-specific-date-in-jquery-datepicker/