JQuery Takvim Uygulaması Yapma

 bcakir
 7 Eylül 2011

Merhaba arkadaşlar bu uygulamamızda JQuery ile takvim uygulaması yapacağız. Takvimimizin mantığı, facebook etkinlik oluşturmada ki takvim yapısına benzeyecek. Kısaca uygulamamız text kutusuna tıklandığında takvimin açılması ve buradan istenilen tarihi seçmemize dayanıyor. Uygulamamızı hazır JQuery kütüphanelerini kullanarak çok az kodla yapacağız. Siz isterseniz uygulamamızın css dosyasını indirerek yapacağımız takvimin görüntüsünü değiştirebilirsiniz. Yapacağımız uygulamamıza benzeyen demoyu görmek isteyen bu adresten inceleyebilir. Şimdi uygulamamızı yapalım.

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<title>JQuery Takvim Uygulaması</title>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
<script type="text/javascript" src="http://jqueryui.com/ui/i18n/jquery.ui.datepicker-tr.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    $("#tarih_al").datepicker($.datepicker.regional["tr"]);
});
</script>
</head>
<body>
<div>Tarih: <input type="text" id="tarih_al" /></div>
</body>
</html>

Uygulamamızı hazır kütüphaneleri kullanarak birkaç satır kodla yaptık. Başka bir görüntü şekli isteyen buradan farklı örnekleri inceleyip uygulamamızın css dosyasını değiştirerek kullanabilirsiniz. Ayrıca Tükçe js dosyasını değiştirip, farklı dillere de kolaylıkla uyarlayabilirsiniz. Ben sadece fikir vermesi ve JQuery ile takvim yapmanın ne kadar kolay olduğunu sizlere göstermek için bu uygulamayı yaptım. Yaralı bir uygulama olması dileğiyle.

 6.237 Okunma

Bu yazıya 4 yorum yapılmış.

  1. JQuery saolsun artık herşey çok kolaylaştı 😀

  2. Tam istediğim gibi bir şey bunu umarım aklıma koyduğum şekilde kullanırım…

  3. sayın hocam bunu nasıl kullanacağım. yani takvime tıkladığım zaman günlere tıkladığım zaman içeriğe nasıl gidecek yani veritabanına nasıl bağlayacağım.

    • Tarih input alanına isim ver (name=”tarih” gibi), form etiketleri arasına al ve tarih alanının altına bir submit butonu (

Yazı hakkında görüşlerinizi belirtmek istermisiniz?

Daha fazla JQuery
Kapat