datepicker

Element datepicker pozwala użytkownikowi na wprowadzenie daty. Trzy typy są wyświetlone, które to mogą być określone przy zastosowaniu atrybutu type.

  • normal - datepicker z trzema polami dla wprowadzenia roku, miesiąca i dnia.
  • grid - datepicker z siatką kalendarza dla zaznaczonego dnia.
  • popup - normalny element datepicker z trzema polami, lecz z dodatkowym rozwijanym przyciskiem wyświetlającym wyskakującą siatkę.

Jest tu kilka sposobów na ustawienie zaznaczenia dnia. W języku XUL wartość atrybutu może być ustawiona na wartość w formie: YYYY/MM/DD, aby inicjalizować datepicker do pewnej daty. Jeśli nie jest określona to domyślnie datepicker jest bieżącym dniem.

Aby zmienić zaznaczoną datę, wartość własności może być zastosowana do ustawienia nowej wartości w formie YYYY/MM/DD. Własność dateValue może być zastosowana do odzyskania i ustawienia daty stosując obiekt Date. W dodatku własności date, month i year mogą być zastosowane do odzyskania i modyfikacji każdego komponentu daty osobno.

Atrybuty
disabled, firstdayofweek, readonly, type, tabindex, value
Własności
date, dateLeadingZero, dateValue, disabled, month, monthLeadingZero, open, readOnly, tabIndex, value, year, yearLeadingZero

Przykład

Grafika:Controlsguide-datepicker-grid.png

<datepicker type="grid" value="2007/03/26"/>

Atrybuty

disabled
Typ: boolean
Określa, czy element jest wyłączony. Jeśli atrybut ten ma wartość true, to element będzie wyłączony. Wyłączone elementy zazwyczaj są wyszarzone. Jeśli element jest wyłączony, nie odpowiada na czynności użytkownika, nie może zostać na niego ustawiony focus, a zdarzenie command nie zostanie wywołane.
grafika:XUL_ref_attr_disabled.png
<!-- Pole wyboru włącza/wyłącza przycisk -->
<checkbox label="Enable button" 
    onclick="document.getElementById('buttRemove').disabled = this.checked"/>
<button id="buttRemove" label="Remove All" disabled="true"/>
firstdayofweek
Typ: integer
Dzień tygodnia, który jest wyświetlany jako pierwszy dzień w siatce kalendarza. Zakres wartości jest od 0 do 6, gdzie 0 jest niedzielą, a 6 jest sobotą. Domyślna wartość jest określana lokalnie, więc tylko stosujemy ten atrybut, jeśli chcemy to przesłonić.
readonly
Typ: boolean
Jeśli ustawiony jest na true, to użytkownik nie będzie mógł zmienić wartości elementu. Jednakże wartość wciąż może zostać zmodyfikowana poprzez skrypt.
tabindex
Typ: integer
Porządek dla przełączania elementów klawiszem Tab. Elementy o wyższym tabindex umieszczane są w dalszej części sekwencji przełączania.
type
Typ: jedna z wartości poniżej
Możemy ustawić typ atrybutu na jeden z poniższych określonych typów elementu datepicker, aby je zastosować:
  • normal: Element datepicker z trzema polami dla wprowadzenia roku, miesiąca i dnia. Ta wartość jest domyślna, więc nie określaj typu atrybutu, jeśli jego wartość jest już pobrana.
  • grid: Element datepicker, który wyświetla siatkę kalendarza , gdzie jeden miesiąc jest pokazany w jednym czasie.
  • popup: Element datepicker z trzema polami do wprowadzenia lecz but an additional dropdown button, which, when pressed, will display a popup calendar grid.
value
Typ: string
Łańcuch znaków pozwalający na łączenie sie wartości daty z elementem. Nie jest stosowany dla określonego celu, lecz możemy uzyskać do niego dostęp przy pomocy skryptu, wykorzystując go do własnych celów.

Własności

date
Typ: integer
Aktualnie zaznaczona data dnia miesiąca od 1 do 31. Ustaw tą własność do zmiany zaznaczonej daty.
dateLeadingZero
Typ: boolean
Wartość tylko do odczytu sygnalizująca gdzie wiodące zero powinno być wyświetlone przed datą zanim jest ona mniejsza niż 10.
dateValue
Typ: Date
Data, która jest aktualnie wprowadzana lub zaznaczona w datepicker jako obiekt Date.
disabled
Typ: boolean
Pobiera i ustawia wartość atrybutu disabled.
month
Typ: integer
Aktualnie zaznaczony miesiąc z przedziału od 0 do 11. Ustaw tą własność, aby zmienić zaznaczony miesiąc.
monthLeadingZero
Typ: boolean
Wartość tylko do odczytu sygnalizująca gdzie wiodące zero powinno być wyświetlone przed miesiącem zanim jest on mniejszy niż 10.
open
Typ: boolean
For popup type datepickers, specifies whether the popup is open. Set this property to open or close the popup. For non-popup datepickers, this property is always false.
readonly
Typ: boolean
Jeśli jest ustawiony na true, to użytkownik nie może zmieniać wartości elementu. Jest to odpowiednia własności do użytku textbox zamiast własności readonly.
tabIndex
Typ: integer
Pobiera i ustawia wartość atrybutu tabindex.
value
Typ: string
The currently selected date in the form YYYY/MM/DD. Unlike, the month property, months in this value range from 01 to 12. Set this property to change the selected date.

 

year
Typ: integer
Aktualnie zaznaczony rok z przedziału od 1 do 9999. Ustaw tą własność, aby zmienić zaznaczony rok.
yearLeadingZero
Typ: boolean
Wartość tylko do odczytu sygnalizująca gdzie wiodące zero powinno być wyświetlone przed rokiem zanim jest on mniejszy niż 1000.

Metody

Dziedziczy z elementu XUL
blur, click, doCommand, focus, getElementsByAttribute

Dziedziczy z elementu DOM
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()

Podobne

Interfejsy
nsIDOMXULControlElement

Autorzy i etykiety dokumentu

Autorzy tej strony: Ptak82, lmorchard, Mgjbot
Ostatnia aktualizacja: Ptak82,