Timezone

Description #Link to section description

The timezone input is a hidden field marked is="ds-input-timezone". When the component upgrades it sets the value to the IANA timezone of the browser, such as America/Toronto, so the server can store it with the submission.

The server renders it empty because it only knows UTC. Without JavaScript the field posts an empty value, which the server must treat as unchanged.

Example #Link to section example

Accessibility #Link to section accessibility

• The field is type="hidden", so it is not announced and takes no focus.
• Do not rely on it alone for anything the person must confirm; show the detected timezone if it changes what they see.

References #Link to section references

• Intl.DateTimeFormat resolvedOptions()(opens in new tab) — MDN
• Customized built-in elements(opens in new tab) — MDN

Related #Link to section related

• JavaScript enabled — another hidden field filled on upgrade
• DataTime — formats dates for display

Variables #Link to section variables

• id — defaults to timezone
• name — defaults to the id
• value — defaults to empty