How do I remove Saturday and Sunday from a Date field

I would like to remove Saturday and Sunday from a Date Field using Public Forms, is that possible? I basically do not want users to pick Saturday or Sunday.

Hello @adasilva,

You can disable certain week days with this code:

fd.field('Date').widgetOptions = {

    disableDates: ["we", "th", "mon"],
}

It worked thank you! Quick question, could I use this same logic if I wanted to disable a specific day i.e. July 1, 2020

@adasilva,

You can disable specific date like this:

fd.field('Date').widgetOptions = {

    disableDates: [new Date(2020,6,1)],
} 

Please find more information about date field properties here.

Thank you for the information.

1 Like

Question, I have disabled all Saturday & Sunday with the code below

fd.field('Date').widgetOptions = {

disableDates: ["sat", "sun"],

}

Is it possible to enable a specific day in a Saturday with the command below?

fd.field('Date').widgetOptions = {

enableDates: [new Date(2020,6,20)],

}

Hello @adasilva,

There is no enableDates property for Date and Time field.

You can either list specific dates to disable or add validation on the form that checks what day of the week is selected and throw the error if it is Saturday or Sunday.

Hello,

I'm trying to disable specific date (Sept 28, 2020) on the calendar using the command below but it is not working. Please assist

fd.field('Date1').widgetOptions = {

disableDates: [new Date(2020,9,28)],
disableDates: ["sat", "sun"]

}

Hello @adasilva,

You can use this code to disable certain dates and weekends:

fd.field('Date1').widgetOptions = {

disableDates: function (date) {
    console.log(date)
                var disabled = [new Date(2020,9,28)];
                if(date){
                    return date.getDay() === 0 || date.getDay() === 6 ||disabled.map(Number).indexOf(+date) >= 0
                }
            }
}

hi,
is there a way to disable dates from a Sharepoint holiday list?
I have holidays and province, as we have some holidays that are different for provinces
RP

Hello @r_pat,

You can retrieve the dates from the SharePoint list using PnP js library and disable these dates using this code:

fd.field('Date').widgetOptions = {

    disableDates: [new Date(2020,6,1)],
}

would this look right?

function HideHolidays(){
import { sp } from "@pnp/sp";
import "@pnp/sp/webs";
import "@pnp/sp/lists";
import "@pnp/sp/items";

	const items: any[] = await sp.web.lists.getByTitle("Holidays").items.select("Title", "ID", "Date", "Province", "Year").filter(filter).get().then(function(items){
		if(items.length > 0){
			fd.field('StartDate').widgetOptions = {
				disableDates: items[0].Date,
			}
		}
	}

}

Hello @r_pat,

Are you using Plumsail Forms for SharePoint?

Then you can use the below code to retrieve dates from the list and disable these dates in the calendar:


fd.spRendered(function() {
  var datesToDisable = [];
  pnp.sp.web.lists.getByTitle("ListName").items.get().then(function(items){
    console.log(items)
    items.forEach(function(item){
      datesToDisable.push(new Date(item.ColumnName))
    })
    return datesToDisable
  }).then(function(datesToDisable){
    fd.field('Date').widgetOptions = {

      disableDates: datesToDisable,
  }
  })
});

Replace ListName with the internal name of the list, ColumnName with the internal name of th column that stores dates.

thank you this worked.

due to provincial holidays not all provinces get the same holidays.

for example, ON doesn’t get Nov. 11 remembrance day but the Provence of BC does.

in my holidays list I have the provinces there.

in my employee list I have the provinces where the employee works.

how can I block the BC holidays only for the users in BC and users for ON only see ON holidays?

hope the above makes sense.

hi, so when i added this code,

I am running into an issue where, now if I select the time from the Date and time field, the time is not changing. its stays to default 12am

@r_pat,

Yeah, really something is wrong with the time picker. I've changed the code. Please try it out.

fd.spRendered(function() {
  var datesToDisable = [];
  pnp.sp.web.lists.getByTitle("ListName").items.get().then(function(items){
    console.log(items)
    items.forEach(function(item){
      datesToDisable.push(new Date(item.ColumnName))
    })
    return datesToDisable
  }).then(function(datesToDisable){
    fd.field('Date').widgetOptions = {

    disableDates: function (date) {
                    if(date){
                        return datesToDisable.map(Number).indexOf(+date) >= 0
                    }
                }
    }
  })
});

You can apply the filtration in PnPjs request as was in your post

Hi this worked.

Would you be able to help with this

due to provincial holidays not all provinces get the same holidays.

for example, ON doesn’t get Nov. 11 remembrance day but the Provence of BC does.

in my holidays list I have the provinces there.

in my employee list I have the provinces where the employee works.

how can I block the BC holidays only for the users in BC and users for ON only see ON holidays?

hope the above makes sense.

@r_pat,

Where the employee list is stored? is it a SharePoint lisе? Does it store user id or login name?

the are stored in a SP list "PTO-Admin"

i have the employee name from the people picker

@r_pat,

You can use PnPjs to get the province of the current user and then filter dates, see the code sample:

var currentUserId = _spPageContextInfo.userId;

pnp.sp.web.lists.getByTitle('EmployeeList').items.filter('PeoplePickerId eq ' + currentUserId).get().then(function(items){
      return items[0].Province	
}).then(function(Province){
	pnp.sp.web.lists.getByTitle('Dates').items.filter('Province eq ' + province).get().then(function(dates){
        //code to diable dates
})
});