Visit Mozilla.org

XUL:timepicker

From MDC

This article covers features introduced in Firefox 3

« XUL Reference home    [ Examples | Attributes | Properties | Methods | Related ]

The timepicker is used to allow the user to enter a time. It contains three fields to enter the hour, minute and second. Arrow buttons next to the fields allow the values to be adjusted with the mouse. A fourth textbox appears for 12 hour clocks which allows selection of AM or PM.

To specify the initial, use the value attribute set to a value of either the form HH:MM:SS or HH:MM. The value may be retrieved and changed using the value property or the dateValue property. The former specifies the time as a string of the form HH:MM:SS whereas the latter specifies the time as a Date object. In addition, the hour, minute and second properties may be used to retrieve and modify each component of the time separately.


Attributes
disabled, hideseconds, increment, readonly, tabindex, value
Properties
amIndicator, dateValue, disabled, hideSeconds, hour, hourLeadingZero, increment, is24HourClock, isPM, minute, minuteLeadingZero, pmIndicator, readOnly, second, secondLeadingZero, tabIndex, value

[edit] Examples

<timepicker value="12:05"/>

Image:Controlguide-timepicker.png

[edit] Attributes

Inherited from XUL element
align, allowevents, allownegativeassertions, class, coalesceduplicatearcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortDirection, sortResource, sortResource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width

disabled
Type: boolean
Indicates whether the element is disabled or not. If this element is set to true the element is disabled. Disabled elements are usually drawn with grayed-out text. If the element is disabled, it does not respond to user actions, it cannot be focused, and the command event will not fire.

hideseconds
Type: boolean
Indicates whether to show the seconds field.

readonly
Type: boolean
If set to true, then the user cannot change the value of the element. However, the value may still be modified by a script.

increment
Type: integer
Indicates the number of minutes to skip each time the arrows are pressed. This should be used in combination with setting hideseconds to true.

tabindex
Type: integer
The tab order of the element. The tab order is the order in which the focus is moved when the user presses the "tab" key. Elements with a higher tabindex are later in the tab sequence.

value
Type: string
The initial value of the timepicker in either the form HH:MM:SS or HH:MM.

[edit] Properties

Inherited from XUL element
align, allowEvents, boxObject, builder, className, collapsed, contextMenu, controllers, currentItem, database, datasources, dir, flex, height, hidden, id, left, listBoxObject, maxHeight, maxWidth, menu, minHeight, minWidth, observes, ordinal, orient, pack, persist, ref, resource, statusText, style, tooltip, tooltipText, top, value, width

Inherited from DOM element
attributes, childNodes, cloneNode, firstChild, lastChild, localName, namespaceURI, nextSibling, nodeName, nodeType, nodeValue, ownerDocument, parentNode, prefix, previousSibling, tagName

amIndicator
Type: string
The string value displayed for hours between midnight and noon, defaulting to AM. This value is determined from the user's locale.

dateValue
Type: Date
The date that is currently entered or selected in the datepicker as a Date object.

disabled
Type: boolean
Gets and sets the value of the disabled attribute.

hideSeconds
Type: boolean
Indicates whether the seconds field is visible or not.

hour
Type: integer
The currently selected hour from 0 to 23. Set this property to change the selected hour.

hourLeadingZero
Type: boolean
A read only value indicating whether a leading zero should be displayed before the hour when it is less than 10.

increment
Type: integer
Gets and sets the value of the increment attribute.

is24HourClock
Type: boolean
A read only value indicating whether a 12-hour or 24-hour clock is used to display times. With a 12-hour clock, an extra field allows the user to pick between AM and PM. This value is determined from the user's locale.

isPM
Type: boolean
If false, the hour is between 0 and 11, and if true, the hour is 12 or greater.

minute
Type: integer
The currently selected minute from 0 to 59. Set this property to change the selected minute.

minuteLeadingZero
Type: boolean
A read only value indicating whether a leading zero should be displayed before the minute when it is less than 10.

pmIndicator
Type: string
The string value displayed for hours between noon and midnight, defaulting to PM. This value is determined from the user's locale.

readOnly
Type: boolean
If set to true, then the user cannot modify the value of the element.

second
Type: integer
The currently selected second from 0 to 59. Set this property to change the selected second.

secondLeadingZero
Type: boolean
A read only value indicating whether a leading zero should be displayed before the second when it is less than 10.

tabIndex
Type: integer
Gets and sets the value of the tabindex attribute.

value
Type: string
The currently entered time of the form HH:MM:SS. Set this property to change the time.

[edit] Methods

Inherited from XUL element
blur, click, doCommand, focus, getElementsByAttribute

Inherited from DOM element
addEventListener, appendChild, dispatchEvent, getAttribute, getAttributeNode, getAttributeNodeNS, getAttributeNS, getElementsByTagName, getElementsByTagNameNS, hasAttribute, hasAttributeNS, hasAttributes, hasChildNodes, insertBefore, isSupported, normalize, removeAttribute, removeAttributeNode, removeAttributeNS, removeChild, removeEventListener, replaceChild, setAttribute, setAttributeNode, setAttributeNodeNS, setAttributeNS

[edit] Related

Interfaces
nsIDOMXULControlElement