Jquery UI Takvim(Datepicker)
UstaDerslik Soru-Cevap Yararlı Araçlar
arama ikon
Diller
Türkçe Türkçe

bilgi UstaDerslik
Bu uyari kutusudur.
Tamam
Anasayfa
İletişim
Üyeler

Jquery UI Takvim(Datepicker)

profil
cArleone
BEĞEN(1)
BEĞENME(0)
GÖRÜNTÜLENME(11705)
RAPOR ET
Web sitelerimizde kullanıcıdan tarih girdisi almak isteyebiliriz.Bunun için jquery ui nin güzel bir takvim özelliği var.Özelleştirmelere açık bir plugin.İstersek jquery nin sitesinden kendimiz tasarım yapıp o dosyayı çağırarakta tasarım değiştirebiliriz.

Burdan pluginin nasıl kullanılacağını inceleyin.



indir : http://ustaderslik.com/dosya/Jquery-Uİ%20(Takvim).rar

<html>
<head>
<title>cArleone</title>
<script type="text/javascript" src="jquery-1.9.0.js"></script>
<script type="text/javascript" src="jquery-ui-1.10.0.custom.js"></script>
<link rel="stylesheet" href="demos.css" />
<link rel="stylesheet" href="jquery-ui-1.10.0.custom.min.css" />

<script type="text/javascript">
$(function() {

$( "#tarih" ).datepicker({
dateFormat: "yy-mm-dd",//tarih formatı yy=yıl mm=ay dd=gün
appendText: "(yıl-ay-gün)",//inputun sonuna bu yazıyı yazar.
autoSize: true,//inputu otomatik boyutlandırır
changeMonth: true,//ayı elle seçmeyi aktif eder
changeYear: true,//yılı elee seçime izin verir
dayNames:[ "pazar", "pazartesi", "salı", "çarşamba", "perşembe", "cuma", "cumartesi" ],//günlerin adı
dayNamesMin: [ "pa", "pzt", "sa", "çar", "per", "cum", "cmt" ],//kısaltmalar
defaultDate: +5,//takvim açılınca seçili olanı bu günden 10 gün sonra olsun dedik
/*isRTL: true//takvimi ters çevirir garip bi özellik :D*/
maxDate: "+2y+1m +2w",//ileri göre bilme zamanını 2 yıl 1 ay 2 hafta yaptık
minDate: "-1y-1m -2w",//geriyi göre bilme alanını 1 yıl 1 ay 2 hafta yaptık.bunu istediğiniz gibi ayarlaya bilirsiniz
monthNamesShort: [ "Ocak", "Şubat", "Mart", "Nisan", "Mayıs", "Haziran", "Temmuz", "Ağustos", "Eylül", "Ekim", "Kasım", "Aralık" ],//ay seçim alanın düzenledik
nextText: "ileri",//ileri butonun türkçeleştirdik
prevText: "geri",//buda geri butonu için
showAnim: "bounce",//takvim açılım animasyonu alta tüm animasyon isimleri yazdım
/*fold-blind-bounce-clip-drop-explode-fade-highlight-puff-pulsate-scale-shake-slide-size-transfer*/
showOn: "both",//inputun yanına ... butonu koyuyor
});

});
</script>
<style type="text/css">
</style>
</head>
<body>

<input type="text" id="tarih" />


</body>



Kod
Kalın
Vurgu
Resim
Video
Url
CEVAPLA
Tüm Hakları Saklıdır. ©Arleone 2013-2014 UstaDerslik






Giriş
Şifremi Unuttum...
Şifre Talep
  Kuralları Kabul Ediyorum.
Kaydol