Disabling Past Dates in DateTimePicker

Support
1

Daxit-LOGGIX:
Hello.

anyone please tell me how we can disabled the past date in FMB dateTimePicker?

{
    "dateTimePickerOptions": {
        "format": "DD/MM/YYYY",
        "icons": {
            "today": "fa fa-star"
        },
        "showTodayButton": true
    },
    "format": "DD/MM/YYYY",
    "label": "Active till",
    "model": "document.activeTillDate",
    "required": true,
    "styleClasses": "col-md-12 col-12 sm:px-6 !flex flex-wrap items-center justify-between company-detail-input text-gray-800 text-sm !mb-6",
    "type": "dateTimePicker",
    "validator": "required"
}

Andrew Dam:
Add a minDate key in your dateTimePickerOptions. All dates previous to your minDate will be disabled.

2

Right now I am setting like this “minDate”: “08-07-2024”, and it is working fine. and I want to set the “minDate” value dynamic I mean from the model value. Can we set it?

This is possible, though unfortunately the keys in the datePickerOptions cannot use _calc. However, the datePickerOptions itself can use _calc, so we can create an object in the model and set the minDate that way.

I’ve refactored the date picker example with this implementation. Please take a look!

3

I want to managed the functionality like disabled all dates before current date, so I can’t passed date statically. For that I need to get current date by this function new Date(), so how can I do it with minDate ? and also if I want to set the data dynamically I mean from the backend(Filemaker) then how I can?

The data in the model is dynamic. Therefore, we can set the key in the model from the backend or on the frontend using Javascript. See the previous example for an updated version of this implementation.

Note, as the page elements are already instantiated by the time the onFormLoad runs, the date picker will need to be re-instantiated after we modify the options. This is as simple as setting a visible_calc on the field, and toggling the boolean on and off in the functions. You will also see this implemention in the previously linked example.