You are viewing limited content. For full access, please sign in.

Question

Question

Only allow date picker to be on a Sunday

asked on June 15, 2022

I have a date field that I would like the user to ONLY be able to choose a Sunday date.  How can I code that?

0 0

Answer

SELECTED ANSWER
replied on June 15, 2022 Show version history

This is similar to this question from a week ago: https://answers.laserfiche.com/questions/199561/Date-picker-want-user-to-be-able-to-select-only-every-other-Monday#199567

Yours is a little easier however, since every Sunday is valid, and the other question wanted every other Monday.

This came from a modified version of some code that I use internally that excludes weekends and holidays from a date picker.  This version for you excludes everything except Sundays.

This was tested in Forms 11 Updated 2.

Give your date field the CSS Class of:   limitedDate

Then add this Javascript to your form: 

//Run the following code when the form has finished loading.
$(document).ready(function () {

  //Set the date range of the Date field.
  //Minimum: Today
  //Maximum: 365 days in the future
  updateBlackoutDates();
  function updateBlackoutDates()
  {
    var today = new Date();
    var startDate = new Date();
    var endDate = new Date();
    endDate = today.addDays(365);
    var minDate = $.datepicker.formatDate('yy-mm-dd', new Date(startDate));
    var maxDate = $.datepicker.formatDate('yy-mm-dd', new Date(endDate));
    $('.limitedDate input').attr('min',minDate);
    $('.limitedDate input').attr('max',maxDate);
  }
  
  //The following four function work together to disable any dates on the picker 
  //that are not Sunday.
  //They also add a validation (parsley) setting for invalid date entries.
  function isValidDate(n) {
    var t = n.getDay();
    var d = n.getDate();
    var string = jQuery.datepicker.formatDate('yy-mm-dd', n);
    return (t!=1 && t!=2 && t!=3 && t!=4 && t!=5 && t!=6);    //Only valid date is Sunday t==0
  }
  function checkDate(n) {
    return[isValidDate(n),""];
  }
  function checkField(input, inst) {
    if ($(input).closest('li').hasClass('limitedDate')) {
      $(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, "M/D/YYYY").toDate()); 
    },
    messages: {
      en: 'Not a valid date.'
    }
  });
  $('.limitedDate input').attr('data-parsley-limiteddate','');

});

//Function to Add days to date.
Date.prototype.addDays = function (days) {
    const date = new Date(this.valueOf());
    date.setDate(date.getDate() + days);
    return date;
};

//Function to format dates.
function formatDate(date, format, utc) {
    var MMMM = ["\x00", "January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
    var MMM = ["\x01", "Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
    var dddd = ["\x02", "Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
    var ddd = ["\x03", "Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];

    function ii(i, len) {
        var s = i + "";
        len = len || 2;
        while (s.length < len) s = "0" + s;
        return s;
    }

    var y = utc ? date.getUTCFullYear() : date.getFullYear();
    format = format.replace(/(^|[^\\])yyyy+/g, "$1" + y);
    format = format.replace(/(^|[^\\])yy/g, "$1" + y.toString().substr(2, 2));
    format = format.replace(/(^|[^\\])y/g, "$1" + y);

    var M = (utc ? date.getUTCMonth() : date.getMonth()) + 1;
    format = format.replace(/(^|[^\\])MMMM+/g, "$1" + MMMM[0]);
    format = format.replace(/(^|[^\\])MMM/g, "$1" + MMM[0]);
    format = format.replace(/(^|[^\\])MM/g, "$1" + ii(M));
    format = format.replace(/(^|[^\\])M/g, "$1" + M);

    var d = utc ? date.getUTCDate() : date.getDate();
    format = format.replace(/(^|[^\\])dddd+/g, "$1" + dddd[0]);
    format = format.replace(/(^|[^\\])ddd/g, "$1" + ddd[0]);
    format = format.replace(/(^|[^\\])dd/g, "$1" + ii(d));
    format = format.replace(/(^|[^\\])d/g, "$1" + d);

    var H = utc ? date.getUTCHours() : date.getHours();
    format = format.replace(/(^|[^\\])HH+/g, "$1" + ii(H));
    format = format.replace(/(^|[^\\])H/g, "$1" + H);

    var h = H > 12 ? H - 12 : H == 0 ? 12 : H;
    format = format.replace(/(^|[^\\])hh+/g, "$1" + ii(h));
    format = format.replace(/(^|[^\\])h/g, "$1" + h);

    var m = utc ? date.getUTCMinutes() : date.getMinutes();
    format = format.replace(/(^|[^\\])mm+/g, "$1" + ii(m));
    format = format.replace(/(^|[^\\])m/g, "$1" + m);

    var s = utc ? date.getUTCSeconds() : date.getSeconds();
    format = format.replace(/(^|[^\\])ss+/g, "$1" + ii(s));
    format = format.replace(/(^|[^\\])s/g, "$1" + s);

    var f = utc ? date.getUTCMilliseconds() : date.getMilliseconds();
    format = format.replace(/(^|[^\\])fff+/g, "$1" + ii(f, 3));
    f = Math.round(f / 10);
    format = format.replace(/(^|[^\\])ff/g, "$1" + ii(f));
    f = Math.round(f / 10);
    format = format.replace(/(^|[^\\])f/g, "$1" + f);

    var T = H < 12 ? "AM" : "PM";
    format = format.replace(/(^|[^\\])TT+/g, "$1" + T);
    format = format.replace(/(^|[^\\])T/g, "$1" + T.charAt(0));

    var t = T.toLowerCase();
    format = format.replace(/(^|[^\\])tt+/g, "$1" + t);
    format = format.replace(/(^|[^\\])t/g, "$1" + t.charAt(0));

    var tz = -date.getTimezoneOffset();
    var K = utc || !tz ? "Z" : tz > 0 ? "+" : "-";
    if (!utc) {
        tz = Math.abs(tz);
        var tzHrs = Math.floor(tz / 60);
        var tzMin = tz % 60;
        K += ii(tzHrs) + ":" + ii(tzMin);
    }
    format = format.replace(/(^|[^\\])K/g, "$1" + K);

    var day = (utc ? date.getUTCDay() : date.getDay()) + 1;
    format = format.replace(new RegExp(dddd[0], "g"), dddd[day]);
    format = format.replace(new RegExp(ddd[0], "g"), ddd[day]);

    format = format.replace(new RegExp(MMMM[0], "g"), MMMM[M]);
    format = format.replace(new RegExp(MMM[0], "g"), MMM[M]);

    format = format.replace(/\\(.)/g, "$1");

    return format;
};

 

Result:

Edited to add: note that the code is written with the assumption that you only have one field with the limitedDate class.  If you have more than one, the code will need to be tweaked slightly.

2 0
replied on June 21, 2022

Matthew Tingey, You are awesome!  The only thing I needed to change was the value for startDate because I need the user to be able to choose the Sunday before today.

1 0
replied on June 21, 2022

That's great!  I'm glad it worked for you.

0 0

Replies

You are not allowed to reply in this post.
You are not allowed to follow up in this post.

Sign in to reply to this post.