Okno wyboru daty i godziny
Tylko na urządzeniach mobilnych z systemem operacyjnym Android lub iOS widok Okno wyboru daty i godziny służy do wyświetlania rodzimego okna wyboru daty i godziny udostępnianego przez system operacyjny. To zachowanie oznacza, że użytkownicy widzą różne okna wyboru daty i godziny. Na przykład w systemie operacyjnym Android użytkownik może pracować nad zadaniem, używając przeglądarki Google Chrome i widząc rodzime okno wyboru daty i godziny systemu operacyjnego Android. Jeśli następnie użytkownik zacznie pracować na urządzeniu iPhone firmy Apple, zamiast tego okna będzie widzieć rodzime okno wyboru daty i godziny systemu iOS.
Mimo że data jest zapisywana w formacie czasu UTC, wyświetlana data i godzina są dostosowywane do strefy czasowej systemu użytkownika.
Ograniczenia
Jeśli użytkownik wpisze treść, która nie jest pełną datą lub ma niepoprawny format, powiązany element danych ma wartość NULL, gdy użytkownik wyzwoli zdarzenie graniczne, takie jak kliknięcie przycisku. Gdy przepływ powróci do strony, widok będzie pusty. Wszystkie inne widoki powiązane z tym samym elementem danych również będą puste.
Użycie rodzimych okien wyboru daty i godziny oznacza, że niektóre opcje konfiguracyjne nie mają zastosowania. Na przykład nie mają zastosowania następujące właściwości:
- Wyłączone dni tygodnia
- Daty niedostępne
- Data rozpoczęcia niedostępnego okresu
- Data zakończenia niedostępnego okresu
- Początek tygodnia
- Typ kalendarza (jeśli wybrana jest opcja hebrajski lub muzułmański )
- Typ wyboru daty (gdy wybrana jest opcja Inline )
Powiązanie danych
Na karcie właściwości
Ogólne można ustawiać i modyfikować powiązanie danych
widoku. Powiązanie danych zawiera
początkową datę i godzinę do wyświetlenia, a ponadto przechowuje aktualizacje
danej wartości. Typ danych: Date.
Właściwości konfiguracyjne
W obszarze Konfiguracja można ustawić lub zmodyfikować właściwości wyglądu i zachowania widoku.
- Wielkość ekranu
- Właściwość konfiguracyjna, na której znajduje się ikona Rozmiarów ekranu
obok nazwy właściwości, może mieć różne wartości dla każdej wielkości ekranu. Jeśli nie zostanie ustawiona wartość, wielkość ekranu dziedziczy wartość następnej większej wielkości ekranu jako swoją wartość domyślną.
- Definicje kompozycji
- Definicje kompozycji służą do podawania kolorów i stylów widoku oraz do określania jego wyglądu. W edytorze kompozycji można wyświetlić podgląd wyglądu i zachowania widoku. Patrz Kompozycje.
| Właściwość konfiguracyjna wyglądu | Opis | Typ danych |
|---|---|---|
Typ pola wyboru daty ![]() |
Sposób wyświetlania kalendarza w oknie wyboru daty i
godziny:
Wartością domyślną jest Wprowadzanie tekstu. |
DatePickerType |
| Szerokość | Szerokość okna wyboru daty i godziny, gdy w przypadku właściwości Typ okna wyboru daty jest wybrana opcja Wprowadzanie tekstu. Szerokość jest wyrażana w pikselach (px), jako wartość procentowa (%) lub w firetach (em). Na przykład: 200px. Jeśli razem z wartością liczbową nie jest podany typ jednostki, domyślnie używana jest jednostka px (piksele). Domyślnie szerokość nie jest podawana. | String |
Wielkość ![]() |
Wielkość tekstu w widoku, wielkość tekstu etykiety i wielkość dopełnienia wokół tekstu. Na przykład, aby tekst i etykieta były bardziej czytelne dla smartfonów, można ustawić tę opcję konfiguracji na wartość Large , aby zrekompensować małą wielkość ekranu. | TextSizeStyle |
Rozmieszczanie etykiet ![]() |
Położenie etykiety okna wyboru daty i godziny. | LabelPlacement |
Szerokość etykiety ![]() |
Szerokość etykiety. Szerokość jest wyrażana w następujących jednostkach: px (piksele), % (wartość procentowa) lub em (firety). Na przykład: 50 px, 20% lub 0,4 em. Jeśli nie jest podana żadna jednostka, domyślnie jest używana jednostka px (piksele). | String |
| Formatowanie | Format używany do wyświetlania i analizowania tekstu wprowadzanego w polu tekstowym. Akceptuje różnorodne dane wejściowe daty, w tym formaty, które są bliżej języka naturalnego, z separatorami lub bez, odstępami, tylko dniem i miesiącem, tylko dniem itd. Na przykład, jeśli wpiszesz 17, okno wyboru daty przyjmuje wartość 17th bieżącego miesiąca i roku. W przypadku wejścia 5/25przyjmuje on miesiąc/dzień bieżącego roku. Ta opcja konfiguracyjna ma zastosowanie tylko wtedy, gdy przeglądarka nie ma własnego okna wyboru daty i godziny. |
String |
| Początek tygodnia | Dzień, od którego ma zaczynać się tydzień. Wartością domyślną jest niedziela. | DatePickerWeekStart |
| Wyłączone dni tygodnia | Jeden lub więcej dni tygodnia, które mają zostać zablokowane w kalendarzu. Domyślnie żaden dzień nie jest wyłączony. | DatePickerDisabledWeekDays |
| Pokaż przycisk Dzisiaj | Służy do pokazywania lub ukrywania przycisku Dzisiaj, który umożliwia ustawienie dzisiejszej daty. Domyślnie przycisk nie jest wyświetlany. | Boolean |
| Pokaż przycisk Wyczyść | Służy do pokazywania lub ukrywania przycisku Wyczyść, który umożliwia wyczyszczenie wartości daty. Domyślnie przycisk nie jest wyświetlany. | Boolean |
| Układ | Orientacja kalendarza po kliknięciu. | DatePickerOrientation |
| Styl koloru | Styl koloru okna wyboru daty i godziny. Kolory odpowiadają zmiennym w podanej kompozycji. Wartością domyślną jest Domyślny (ciemnoniebieski). | DatePickerColorStyle |
Pokaż numer tygodnia ![]() |
W przypadku kalendarza gregoriańskiego służy do wyświetlania numeru tygodnia w roku. Na przykład ostatni tydzień w roku gregoriańskim jest numerem tygodnia.52. Domyślnie, nie jest wyświetlany numer tygodnia. | Boolean |
| Wyróżnij dzisiejszą datę | Służy do wskazywania, czy w kalendarzu ma być wyróżniana dzisiejsza data. Domyślnie dzisiejsza data nie jest wyróżniana. | Boolean |
| Ukryj nagłówek | Służy do ukrywania nagłówka znajdującego się u góry niestandardowego okna wyboru daty i godziny. Domyślnie nagłówek nie jest ukrywany. | Boolean |
| Pokaż ikonę kalendarza | Wyświetlania ikonę kalendarza w polu wprowadzania tekstu. | Boolean |
| Styl selektora roku | Styl selektora roku, Domyślny lub Nowoczesny. | tableHFStyle |
| Właściwość konfiguracyjna zachowania | Opis | Typ danych |
|---|---|---|
| Tylko niestandardowe okno wyboru | Wskazuje, że na urządzeniu mobilnym zawsze ma być wyświetlane niestandardowe
okno wyboru daty i godziny zamiast rodzimego okna wyboru daty i godziny. Na urządzeniach mobilnych zawsze na początku jest podejmowana próba wyświetlenia rodzimego okna wyboru daty i godziny. Niestandardowe okno wyboru daty i godziny jest wyświetlane zawsze wtedy, gdy zostanie podana jedna z następujących nieobsługiwanych właściwości konfiguracyjnych:
Domyślnie zarówno niestandardowe, jak i rodzime okno wyboru daty i godziny są używane w odpowiednich miejscach. |
Boolean |
| Dołącz okno wyboru godziny | Służy do wyświetlania okna wyboru godziny razem z widokiem Okno wyboru daty i godziny. Domyślnie okno wyboru godziny nie jest wyświetlane. | Boolean |
| Typ kalendarza | Typ kalendarza:
Wartością domyślną jest gregoriański. |
CalendarType |
| Indeks przechodzenia | Indeks w sekwencji przechodzenia (przy użyciu klawisza Tab). Indeksy przechodzenia rozpoczynają się od 1 (niektórych indeksów może brakować). Na przykład: 1, 5, 10. Właściwość Indeks przechodzenia służy do decydowania o kolejności przechodzenia (za pomocą klawisza Tab) między obszarami interfejsu użytkownika. | String |
| Tekst zastępczy | Tekst zastępczy, który jest używany, gdy nie wprowadzono danych. Zwykle jest to krótki opis lub przykładowe dane wejściowe wymagane przez użytkownika. Jeśli powiązany element danych nie zawiera wartości, do momentu rozpoczęcia wpisywania wartości w tym polu jest wyświetlana wskazówka. Domyślnie tekst zastępczy nie jest podawany. | String |
| Data rozpoczęcia dostępnego okresu | Służy do podawania daty i godziny rozpoczęcia dostępnego okresu. Wszystkie daty przed podaną datą rozpoczęcia dostępnego okresu zostaną zablokowane. Format daty rozpoczęcia dostępnego okresu jest podawany przy użyciu właściwości Format na karcie właściwości Wygląd. Domyślnie data rozpoczęcia dostępnego okresu nie jest podawana. | Date |
| Data zakończenia dostępnego okresu | Służy do podawania daty i godziny zakończenia dostępnego okresu. Wszystkie daty po podanej dacie zakończenia dostępnego okresu zostaną zablokowane. Format daty zakończenia dostępnego okresu jest podawany przy użyciu właściwości Format na karcie właściwości Wygląd. Domyślnie data zakończenia dostępnego okresu nie jest podawana. | Date |
| Daty niedostępne | Pojedyncza data lub lista niekolejnych dat, które mają być niedostępne. Jeśli przeglądarka nie obsługuje dat niedostępnych, a została udostępniona lista dat niedostępnych, w tym widoku zostanie użyte własne okno wyboru daty i godziny, zamiast rodzimego okna przeglądarki. Domyślnie nie są podawane żadne daty niedostępne. | Date (List) |
| Data rozpoczęcia niedostępnego okresu | Data początkowa zakresu kolejnych dat, które mają być niedostępne. Domyślnie data rozpoczęcia niedostępnego okresu nie jest podawana. | Date |
| Data zakończenia niedostępnego okresu | Data końcowa zakresu kolejnych dat, które mają być niedostępne. Domyślnie data zakończenia niedostępnego okresu nie jest podawana. | Date |
| Widok początkowy | Poziom szczegółowości, od którego ma rozpoczynać działanie kalendarz:
Wartością domyślną jest Miesiąc. |
DatePickerStartView |
| Minimalny tryb wyświetlania | Minimalny poziom szczegółowości dat, który ma być używany w kalendarzu:
Wartością domyślną jest Dni. |
DatePickerMinViewMode |
| Nie zamykaj automatycznie | Służy do wskazywania, że kalendarz ma być automatycznie zamykany po wybraniu daty. W przeciwnym razie zostanie zamknięty przy dezaktywowaniu okna wyboru daty i godziny. Domyślnie po wybraniu daty kalendarz jest automatycznie zamykany. | Boolean |
Przykład
Jeśli chcesz mieć klikalny przycisk kalendarza, możesz umieścić widok Okno wyboru daty wewnątrz widoku Grupa wejściowa. We właściwościach widoku Grupa wejściowa w przypadku właściwości Typ przycisku należy ustawić opcję Ikona, a w przypadku właściwości Informacje o przycisku należy ustawić opcję Kalendarz. W zdarzeniu On button click dla widoku grupy wejściowej wpisz następujący łańcuch:
${Control_ID}._instance.pickerControl.show();
Zdarzenia
We właściwościach Zdarzenia można ustawiać i modyfikować procedury obsługi zdarzeń widoku. Zdarzenia mogą być uruchamiane w sposób programowy lub w wyniku interakcji użytkownika z widokiem. Informacje na temat definiowania zdarzeń i kodu zdarzeń zawiera sekcja Zdarzenia zdefiniowane przez użytkownika. Okno wyboru daty/godziny ma następujące typy procedur obsługi zdarzeń:
- On load: aktywowano podczas ładowania strony. Na przykład:
var workerStart = ${StartDate}.getDate(); me.setStart(workerStart); - On change: Aktywacja po wykryciu zmiany. Na przykład:
return confirm("Are you sure you want to change date?") - On day cell render: Aktywowano, gdy wyświetlana jest komórka dnia. Jest wyzwalana przed pokazaniem daty w
oknie wyboru daty i godziny. Na przykład:
me.setDate("01/01/2015")
W zależności od konkretnego zdarzenia można użyć logiki JavaScript, aby zmodyfikować efekty działania widoku. Więcej informacji na temat używania zdarzeń z widokami znajduje się w temacie Zdarzenia zdefiniowane przez użytkownika.
metody
Szczegółowe informacje na temat dostępnych metod wyboru daty/godziny można znaleźć w temacie Interfejs API JavaScript dla wyboru daty/godziny.
Zasoby dodatkowe
Więcej informacji na temat sposobu tworzenia formatki lub strony zawiera sekcja Budowanie formatek.
Informacje na temat standardowych właściwości (Ogólne, Konfiguracja, Pozycjonowanie, Widocznośći Atrybuty HTML) można znaleźć w sekcji Właściwości widoku.