SilverStripe 4 Date Entry in the CMS - showing a calendar? How?

Questions
1

How do you make the CMS Admin display a handy calendar for Date entry with SS4.2.1?

I’ve upgraded a section of a site from SS3 to SS4 and I’ve failed so far to figure out how to get the calendar to display. I’ve formatted the Date how my users would like it just fine.

I read all the GitHub discussion about this and it seemed that things were added in some SS4 releases and were then changed and removed in later versions.

What’s the trick please?

$dateField = new DateField(‘FromDate’);
//$dateField->setConfig(‘showcalendar’, true); // SS3 way - removed in SS4
//$dateField->setShowCalendar(true); // seemed to be in the discussion but removed
$dateField->setHTML5(false); // tried true and it didn’t do it either
$dateField->setDateFormat(‘dd/MM/yyyy’);
$dateField->setAttribute(‘placeholder’, $dateField->getDateFormat());
$fields->addFieldToTab(‘Root.Main’, $dateField);

1 Like
2

Silverstripe 4 changed to using a native HTML datepicker… unfortunately, a number of browsers don’t actually render one when asked!

You can use something like this: GitHub - praxisnetau/silverware-datepicker: SilverWare Datepicker Module to add in support.

3

Thanks for the module recommend.

Just looked up the HTML5 Date field fiasco. Been going on for years as well. Such a shame they can’t all agree and use the spec and build it in to save using external libs.

When I turned HTML5 date on Chrome does one (it’s not an obvious UI) and uses the date format I wanted by default. But that messes up Safari which doesn’t have a Date UI or show the right format in the field anymore.

It’s a shame SS4 didn’t include a new CalendarJS or continue with the old one SilverStripe already had? It had an on/off.

Ah well. Thought I’d just missed something simple in the documentation.

4

Just one note about the module I linked: At the time of writing, it doesn’t support the SS4 public directory structure out of the box. There’s a PR waiting to be merged which adds this support. If you’re in a hurry, you can fork the module and use a modified version until the official one is updated.

1 Like
6

The PR was just merged, so that module should be good for the public dir now :slight_smile:

2 Likes
5

Silver Stripe 4 By default provide a calendar for the date field. Please try with below code snippets.

SS4 comes with default dd/mm/yyyy date format.

use SilverStripe\Forms\DateField;
public function getCMSFields() {
    $fields->addFieldToTab('Root.Main',new DateField('Date','Date'));
    return $fields;
}

Hope this helps you.

Thanks!

7

In Safari (Mac) – Datapicker won’t work. //Silverware-datepicker – also won’t work fine, it’s magic with saving(); and displays dates.

1 Like
8

Hello @guci0 welcome to the forum. As @Tim all ready said SS4 is using the native HTML datepicker.

If your browser supports it then you will get one if you use an input of the type date. E.g. Firefox and Chrome support the native html date picker.

If you need one for safari you can either use the module dorset suggested or you need some thing like a jQuery Datepicker.

9

I too have a client who isn’t happy about losing the date picker after upgrading their site to SilverStripe 4 (they use Safari).

However, what makes it worse, is that when the HTML5 date field isn’t supported, SilverStripe’s DateField seems to default to displaying the date in the US format.

It’s not possible to use setLocale('en_GB') or setDateFormat('dd/MM/yyyy') as both require you to turn off the HTML5 field option (so users of other browsers will then lose the date picker).

Is there any way to at least make the date display in dd/MM/yyyy in Safari?

1 Like