How do I display "date start time - end time"

Get Help
1

First, I’m not using a calendar component.

I’m building an upcoming events screen. Below the event name, I want to display ‘EventDate’ ‘EventStartTime’ - ‘EventEndTime’

I have those three properties in my Events collection.

For some events, there will be no end time.

I’m running into several problems with this.

First, is it best to put all 3 magic text elements into one text field? Something like:

‘EventDate’ ‘EventStartTime’ - ‘EventEndTime’

This is the cleanest way, but I don’t know how to make the dash disappear when there is no end time.

Do I create 3 separate text fields on the same line? I’m having difficulty properly spacing those 3 fields, and I still have problem of a visible dash when there’s no end time.

Someone please help. This should be simple, but I’m struggling.

2

Separate all elements into their own fields, including the dash. Then set a visibility rule for the dash and end date field, that they will only show if there’s an end date.

In terms of design, it’s trial and error. Test a few options and you’ll find one that looks good.

3

This was a helpful solution. I did all this, but…

In setting the visibility condition for the dash, there doesn’t seem to be a way to say “If EndTime is empty”. Because the EndTime field is a time field, the only options are “If EndTime is after, or before, or between”.

How do I handle that?

4

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.