How to Change the Datefield’s Calendar Start Day

Question

This question comes from a poster in the Formidable Slack Community:

How can I change the inline datepicker field to start on Saturday by default?

Solution

You cannot change the datepicker to start on a different day of the week by default through the Formidable build screen. However, Formidable uses the ubiquitous jQuery UI Datepicker Widget to drive its date field calendar. This jQuery widget has an extensive API that allows you to modify the functionality with your own custom jQuery. In this case, we're going to set the value for the firstDay option when the date field receives focus.

Demo Form

Here's a demo form:

Change Datefield Calendar Start Day Demo

To change the calendar start day, pick your desired start day from the radio button options, then click into the date field to see the result.

Choose Start Day

Custom jQuery

Here's the custom jQuery that makes the form work:

Valid firstDay Values

The valid values for the firstDay option are:

  • Sunday = 0
  • Monday = 1
  • Tuesday = 2
  • Wednesday = 3
  • Thursday = 4
  • Friday = 5
  • Saturday = 6

Sunday, or 0, is the default value.

Reader Interactions

Leave a Reply

Your email address will not be published. Required fields are marked *