ASP.NET AJAX Control Toolkit
Merhaba bu yazımda size Microsoft AJAX control Toolkit’i tanıtacağım.
AJAX özelliklerini kullanan bu kontroller son derece kullanışlıdır.
Pek çok duruma göre düşünülmüş kontroller, geliştiriciye fazladan kodlar yazmadan çok yetenekli arabirimler ve işlevsellikler sunarlar.
Ve en önemlisi bunların hepsinin AJAX özelliği olmasıdır.
Geçen yazımda bir AJAX uygulamasının nasıl geliştirileceğini anlatmıştım.
Bunun için ASP.NET AJAX’ı indirip uygulamayı geliştireceğiniz bilgisayara kurmalısınız.
Böylece editörünüz AJAX özellikli oluyordu. Ancak AJAX’ın nimetlerinden faydalanabilmek için bir araç kutusuna ihtiyacınız var: işte Bu AJAX Contol Toolkit’dir.
AJAX Control Toolkit’i indirmek için http://ajax.asp.net adresine gidip
ASP.NET AJAX Control Toolkit linkini tıklamalısınız.
Daha sonra kontrolleri bilgisayarınıza indirebileceğiniz sayfaya yönlendirileceksiniz.
Buradaki linklerden birini tıklayarak kontrolleri bilgisayarınıza indirebilirsiniz.
Bu iki sürümden bir tanesinde kaynak kodları bulunmaktadır.
Dileğinize göre ikisinden birini seçebilirsiniz.
Kontroller indikten sonra. Aşağıdaki gibi bir klasör yapısıyla karşılaşacaksınız.
Burada SampleWebSite klasöründe, AJAX kontrolleriyle yapılmış örnekler bulunmaktadır.
Bu klasörü Visual Web Developer 2005 Express ile açarak her bir örneği çalıştırıp test edebilirsiniz.
Birazdan bunu göreceğiz.
Ancak siz sıfırdan bir uygulama geliştirmek istiyorsanız, bu klasör içindeki bin klasöründeki AJAXControlToolkit.dll dll’ini alarak toolbox’ınıza ekleyebilirsiniz.
Yapmanız gereken Visual Web Developer 2005 Express’ın toolbox’ına yeni bir tab eklemek
Ve bu yeni açılan tab’a bu dll’i sürükleyip bırakmak.
Yukarıda gördüğünüz üzere, pek çok kontrol buraya ilave edilecek.
Şimdi örnek web uygulamalarına geri dönersek, Toolkit uygulamalarının Visual Web Developer 2005 tarafından doğrudan açılarak test edilebileceğini söylemiştim.
Bunun için Visual Web Developer 2005 de file menüsünden “open web site” seçeneğini tıklamalısınız. Daha sonra örnek uygulamanın olduğu dizini seçerek açmalısınız:
Uygulamamızı F5 veya ctrl + F5 ile çalıştırdığınızda Toolkit’teki bütün kontrollerin örneğini kapsayan web sitesine ulaşırsınız:
Sol tarafta kontrollerin listesi, sağ taraftaysa bunlara ait örnekler görülmektedir.
Buradaki linklere tek tek tıklayarak her birinin işlevselliği hakkında fikir edinebilirsiniz.
Basit Bir Örnek: TextBoxWatermark
Şimdi basit bir örnek üzerinden bir AJAX kontrolünün nasıl sayfaya ekleneceğini ve nasıl kullanılacağını göreceğiz. Yapacağımız uygulama TextBoxWatermark kontrolünü sayfada kullanmak.
Daha önceden görmüşsünüzdür, bir metin kutusu içinde değişik mesajlar verilebilir. Bu mesajlar belli belirsizdir. Bunlara watermark yazılar denir:
Resimde de gördüğünüz üzere, “Buraya adınızı yazın”, “ Buraya soyadınızı yazın” mesajları belli belirsiz bir şekilde (watermark) metin kutusunun içinde gösterilmiştir.
Metin kutusunun içine tıklandığında bu mesaj kaybolur:
Eğer bir şey yazmamışsanız başka bir yere tıkladığınızda mesaj yeniden gözükür.
İşte TextBoxWatermark kontrolü bunu kontrol eder.
Şimdi yapmamız gereken toolbox’ımızdan metin kutularını ve butonu sürükleyerek sayfamıza bırakmak. Ayrıca ScriptManager kontrolü ile TextBoxWatermark kontrolünü de sayfaya eklemeliyiz.
Şimdi TextBoxWatermark değerlerini nasıl vereceğimize bir bakalım:
TextBoxWatermark kontrolünde iki parametre önemlidir birincisi kontrol edeceği (örneğimizde TextBox’lar) sunucu kontrolünün id değeri - TargetControlID ye atanır -.
İkincisiyse Watermark olarak yazılacak metin - WatermarkText e yazılır -.
AJAX kontrolleriyle Watermark özellikli bir metin kutusu oluşturmak bu kadar basittir.
Diğer şekilsel değerleri CSS dosyanızda verebilirsiniz.
Gördüğünüz gibi bir AJAX kontrolünü kullanmak diğer server kontrollerini kullanmak gibidir.
Ancak AJAX uygulamalarının client taraflı olduğunu asla unutmamalıyız.
Bu yazımda sizlere AJAX Contol Toolkit’in nasıl temin edileceğini, uygulamalarımıza nasıl ekleneceğini basit bir örnekle anlattım. Gelecek makalemde görüşmek üzere.