Label: Preferred Time
Required: Yes
Min Time: 09:00
Max Time: 17:00
Interval: 30 min
Format: 12-hour
Description: Available Monday-Friday, 9 AM - 5 PM

Delivery window

Label: Delivery Time Preference
Required: Yes
Options:
  - 08:00-12:00|Morning (8 AM - 12 PM)
  - 12:00-17:00|Afternoon (12 PM - 5 PM)
  - 17:00-20:00|Evening (5 PM - 8 PM)

For time ranges/windows, consider using a Select field with predefined options instead.

Call-back request

Label: Best Time to Call
Required: No
Min Time: 08:00
Max Time: 20:00
Interval: 60 min
Format: 12-hour
Default Value: 10:00

Event start time

Label: Event Start Time
Required: Yes
Interval: 15 min
Format: 24-hour

Combined date + time

For full datetime selection, add both Date and Time fields:

Fields:
  1. Date: "Appointment Date"
  2. Time: "Appointment Time"

In integrations and webhooks, combine them:

{
  "appointment_date": "2024-02-15",
  "appointment_time": "14:30"
}

Or use a hidden field with both values merged.

Timezone considerations

Times are collected in the user's local timezone. Consider:

Displaying your timezone in the description:

Description: Times are in Eastern Time (ET)

Storing timezone info via hidden field:
```
Default Value: {timezone}
```
Converting server-side for calendar integrations

Styling

<div class="fodo-field fodo-field-time">
  <label class="fodo-label" for="field_abc123">
    Preferred Time
    <span class="fodo-required">*</span>
  </label>
  <input
    type="time"
    id="field_abc123"
    name="fields[abc123]"
    class="fodo-input fodo-input-time"
    min="09:00"
    max="17:00"
    step="1800"
    required
  >
</div>

The step attribute is in seconds (1800 = 30 minutes).

Custom styling

.fodo-input-time {
  padding: 10px 12px;
  border: 1px solid #e5e7eb;
  border-radius: 6px;
  min-width: 150px;
}

Data format

Times are stored in 24-hour format: HH:MM

Examples:

09:00 (9:00 AM)
14:30 (2:30 PM)
23:45 (11:45 PM)

Display formatting (12-hour) is applied in the admin and frontend.

Time Field

On this page