Date/Time Input Field Disappears When I Add My Model

Support
1

I’m seeing a weird issue.

When I add a dateTimePicker, the default model is set to something like timePickerStart. The input field is visible.

When I change it to my model "model": "event.timeStart" and refresh the web page, the input field disappears.

If I wrap my model in curly braces "model": "{{event.timeStart}}" the input field reappears … but, it won’t show my development data model.

Here’s my snippet:

{
    "_NOTES": "TIME START",
    "dateTimePickerOptions": {
        "format": "h:mm a",
        "stepping": 15
    },
    "format": "h:mm:ss a",
    "label": "What time do we start playing music?",
    "model": "event.timeStart",
    "required": true,
    "styleClasses": "text-sm text-gray-500 mt-0 md:mt-0 col-start-2 col-span-1 md:col-span-0",
    "type": "dateTimePicker",
    "validator": "required"
}

Pic proof :slight_smile:

Screen Shot 2022-03-26 at 8.44.13 AM
Screen Shot 2022-03-26 at 8.44.13 AM872×154 6.99 KB

2

Did some testing, if the data model is not exactly formatted how the date time picked is configured, the input field will disappear. This includes setting an empty value in the data model.

So if you want to have an empty date time picker that points to event.timeStart, you can try not including event.timeStart in your data model.

If you want to put a default value in the field, then make sure it is in the right format. You can check your data model after making a selection to see how it is formatted. Using your snippet, here’s the format I got:

"event": {
        "timeStart": "2:00:00 pm"
    }

EDIT: Setting the model to null also works