Calendar plugini, jQueryUI Calendar üzerine geliştirilmiştir. Orjinal plugindeki özelliklerin tamamı kullanılabilir. Ayrıca, takvim eklenen alanlarında data tanımları ile de ayarlar değiştirilebilir.
<input type="text" class="calendar" />
<input type="text" id="start" class="calendar" data-calendar-after="#end" />
<input type="text" id="end" class="calendar" data-calendar-before="#start" />
<input type="text" class="calendar" data-time="true"/>
<input type="text" class="calendar" data-time-only="true"/>
Birbirine bağlı çalışan takvimlerde, data-calendar-after ve data-calendar-before tanımları ile, takvim alanlarının idleri ile birbirlerine bağlanır.
| Property |
Default |
Açıklama |
| time |
true |
Takvime saat ve dakika ekler. |
| timeOnly |
true |
Sadece saat seçimini gösterir. |
| controlType |
"select" |
Saat seçimi için slider ya da select box kullanımını belirler. |
| showOtherMonths |
true |
Takvim açıldığında, belirlenen ay dışında, diğer ayların da görüntülenmesine imkan verir. |
| selectOtherMonths |
true |
Takvim açıldığında, belirlenen ay dışında, diğer ayların da seçilebilmesine imkan verir. |
| changeMonth |
true |
Takvim açıldığında, ay değiştirme listesini gösterir |
| changeYear |
true |
Takvim açıldığında, yıl değiştirme listesini gösterir |
| dateFormat |
dd/mm/yy |
Seçilen tarihin, metin kutusunda hangi formatta gözükeceğini belirler. |
| yearRange |
c-10:c+10 |
Takvimdeki yıl seçiminin aralığını belirtir. c şimdiki yılı gösterir. Başlangıç ve bitiş değerleri ":" ile ayrılarak yazılmalıdır. İster c-nn:c+nn şeklinde şimdiki yıla göre bir aralık belirlenebilir. İstenirse nnnn:nnnn şeklinde sabit bir aralık tanımlanabilir. |
| timeLimit |
false |
Timepicker componentinde, seçilen gün bugün ise, ileri bir saat ve dakikanın seçilememesini sağlar. |
| setDateNow |
false |
Component'te bulunulan zamanın seçili olarak gelmesini sağlar. |
| Data Attribute |
|
| time |
Takvime saat ve dakika ekler. |
| time-only |
Sadece saat seçimini gösterir. |
| control-type |
Saat seçimi için slider ya da select box kullanımını belirler. |
| calendar-after |
Bağıl çalıştığı, sonraki ayları/günleri gösteren takvimi belirler. Bağlı çalışacağı takvimin IDsi değer olarak verilmelidir. |
| calendar-before |
Bağıl çalıştığı, önceki ayları/günleri gösteren takvimi belirler. Bağlı çalışacağı takvimin IDsi değer olarak verilmelidir. |
| number-of-months |
Takvim açıldığında kaç ayın gözükeceğini belirler. |
| date-format |
Seçilen tarihin, metin kutusunda hangi formatta gözükeceğini belirler. |
| year-range |
Takvimdeki yıl seçiminin aralığını belirtir. c şimdiki yılı gösterir. Başlangıç ve bitiş değerleri ":" ile ayrılarak yazılmalıdır. İster c-nn:c+nn şeklinde şimdiki yıla göre bir aralık belirlenebilir. İstenirse nnnn:nnnn şeklinde sabit bir aralık tanımlanabilir. |
| time-limit |
Timepicker componentinde, seçilen gün bugün ise, ileri bir saat ve dakikanın seçilememesini sağlar. |
| set-date-now |
Component'te bulunulan zamanın seçili olarak gelmesini sağlar. |
| Callback |
|
| onReady |
Takvim, form elemanına bağlandığında çalışacak fonksiyonu çağırır. |
| onSelect |
Takvimden bir tarih seçildiğinde çalışacak fonksiyonu çağırır. |
| onClose |
Takvim kapatıldığında çalışacak fonksiyonu çağırır. |
| onRemove |
Eleman üzerinden takvim kaldırıldığında çalışacak fonksiyonu çağırır. |
| Method |
Açıklama |
| $(selector).calendar(options) |
Bu method plugini manuel olarak bir elemana bağlamanızı sağlar. |
| $.uxcalendar |
Bu method pluginin detayını görmenizi sağlar |
| $.uxcalendar.version |
Sayfaya eklenmiş pluginin versiyon numarasını gösterir. |
| $.uxcalendar.settings |
Aktif pluginin ayarlarını gösterir. |
| $.uxcalendar.remove(el) |
Elemanın üzerinden Takvim özelliğini kaldırır. el değeri boş gönderilirse, sayfadaki bütün Takvimleri kaldırır. |