Calendar ui

Plug-ul Datapicker vă permite să adăugați un calendar la paginile dvs., care pot fi utilizate pentru selectarea și afișarea datelor. Plugin-ul are multe setări care vă permit să utilizați calendarul pentru o gamă largă de scopuri (consultați exemplele de utilizare de mai sus).







Cea mai obișnuită utilizare a calendarului este selectarea datei. Prin urmare, setul de Datepicker este de obicei setat la un câmp text destinat să introducă datele. În acest caz, calendarul va apărea în pregătirea acestui focus câmp text, și dispar atunci când a pierdut focalizarea, sau când selectați o anumită dată pe calendar (data selectată, în acest caz, vor fi furnizate în caseta de text). Dacă doriți, puteți transforma un calendar obișnuit într-un calendar calendaristic. Pentru a face acest lucru, aplicați plug-in-ul Datepicker la elementul dorit (consultați exemplul "Nu este un calendar temporar").


Tastele rapide Puteți utiliza următoarele taste rapide pentru a lucra cu calendarul:

  • ctrl + stânga / dreapta - ziua următoare / anterioară.
  • pagina sus / jos - următoarea / luna anterioară.
  • ctrl + pagina sus / jos - anul următor / anul precedent.
  • ctrl + home - data curentă (dacă calendarul este închis, acesta va fi deschis).
  • ctrl + sus / jos - următoarea / săptămâna anterioară.
  • introduceți - selectați data evidențiată.
  • ctrl + end - închideți calendarul și resetați valoarea curentă (dacă a fost).
  • ctrl + end - închideți calendarul fără a selecta o dată.


UI utilitare înrudite

Funcția ↓ (): valoarea returnată

Cu această funcție, puteți modifica valorile implicite pentru proprietățile tuturor calendarelor de pe pagină:

$ .datepicker.formatDate (format, data, [setări]): șir

$ .datepicker.parseDate (format, val, [setări]): Data


În procesul de analiză a unui șir cu o dată, pot apărea erori care vor avea ca rezultat următoarele tipuri de excepții:








Exemple de utilizare a lui $ .datepicker.parseDate ():

Funcția specificată anterior va fi apelată imediat înainte de apariția fiecărui calendar. Primul parametru care îi este transmis va conține elementul de intrare la care este atașat calendarul care apare și al doilea parametru conține obiectul calendarului propriu-zis. Dacă această funcție returnează un obiect cu noile setări ale calendarului, acestea vor intra în vigoare imediat. Handlerele pentru acest eveniment nu pot fi setate cu .bind ().

Calendar ui

Când se apelează, această funcție va primi ca parametru unic data prelucrării ca obiect Date. Rezultatul acestei funcții ar trebui să fie o matrice din următoarele valori: [0] - adevărat sau fals, specificând dacă data trecută în parametru este selectabilă; [1] - numele clasei css care va fi utilizată la afișarea datei din calendar sau "" dacă nu sunt folosite clase specifice; [2] - element opțional, în care puteți seta textul pentru promptul care apare când plasați cursorul în calendarul din celulă.

Handlerele pentru acest eveniment nu pot fi setate cu .bind ().

Funcția specificată în "ChangeMonthYear" va fi apelată atunci când calendarul este "flipped" în altă lună sau an. Când se apelează, funcția va primi trei parametri: numărul anului, numărul lunii și obiectul calendar. Această variabilă va conține elementul de intrare la care este legat calendarul curent. Handlerele pentru acest eveniment nu pot fi setate cu .bind ().

Funcția specificată în onClose va fi apelată de fiecare dată când calendarul este închis. Primul parametru care îi este transmis va conține textul datei selectate, în formatul specificat în proprietatea dateFormat sau "" dacă data nu a fost selectată. Al doilea parametru va conține obiectul calendarului propriu-zis. Această variabilă va conține elementul de intrare la care este legat calendarul curent. Handlerele pentru acest eveniment nu pot fi setate cu .bind ().

Funcția specificată în onSelect va fi utilizată pentru a selecta data din calendar. Primul parametru care îi este transmis va conține textul datei selectate, în formatul specificat în proprietatea dateFormat. Al doilea parametru va conține obiectul calendarului propriu-zis. Această variabilă va conține elementul de intrare la care este legat calendarul curent. Handlerele pentru acest eveniment nu pot fi setate cu .bind ().

Plug-in-ul Datepicker folosește foaia de stil standard jQueryUI-css pentru a crea un calendar. Pentru a modifica designul, este recomandat să utilizați o setare manuală specială pe site-ul web al jQuery UI. Pentru manipulări specifice cu elemente de calendar, puteți utiliza informații despre structura sa:







Articole similare

Trimiteți-le prietenilor: