List Search Exrender kontrolü ASP.NET Dropdownlist ve Listbox itemleri içinde aradigimiz kelimenin ilk harflerini yazarak arama yapmamizi sağlayan yeni bir ajax kontrolüdür. Listeleme elemanlari üzerine tiklandiginda Bir uyari mesaji çikar örnegin; arama için birkaç harf giriniz. Bu uyariya sitil verebilir ve pozisyonun belirleyebiliriz. Açiklamamizi yaptiktan sonra kullanimina göz atalim;
Kullanimi
<ajaxToolkit:ListSearchExtender id="LSE" runat="server"
TargetControlID="ListBox1"
PromptText="Type to search"
PromptCssClass="ListSearchExtenderPrompt"
PromptPosition="Top" />
Nesnemizin Özellikerini inceliyelim,
Özellikleri
· PromptText – Listeleme elemanina tiklandiginda gösterilecek olan mesaj · PromptCssClass – Uyari mesajina uygulanacak olan sitil adi · PromptPosition – Uyari mesajinin gösterilecegi yer. Bottom ve Top değerlerini alır. Örnek
Bu anlattiklarimizi bir örnekle devam ettirelim. Örnegimizde Dropdownlist ve Listbox elemanlarinda arama yapacagiz. Örnegimize baslayalim ve ilk olarak bir AJAX Projesi açalim.
Simdi olusturdugumuz bu sayfaya 1 adet Dropdownlist ve Listbox ekleyelim. Bu kontrollerde arama yapmak için 2 adet de ListSearch Extender ekleyelim… Benim olusturdugum sayfa asagidaki gibidir.
Ben listeleme elemanlarina bir miktar item ekledim. Bu elemanlari Databaseden de doldurabiliriz. Ama suan için buna gerek yok.
Simdi ilk olarak Listbox için ListSearch Extenderinin gerekli propertylerini yazalim.
<cc1:ListSearchExtender ID="ListSearchExtender2" runat="server" TargetControlID="ListBox1" PromptText="Arama yapmak için yaziniz..." PromptPosition="Top" PromptCssClass="modalPopup">
</cc1:ListSearchExtender>
Yukarida PromptCssClass="modalPopup" CSS’i de yazalim.
<style type="text/css">
.modalPopup {
background-color:#ffffdd;
border-width:2px;
border-style:solid;
border-color:Gray;
padding:0px;
}
</style>
Simdide dropdownlist için ListSearch Extender için gerekli kodlari yazalim. Hiçbir fark yok sadece TargetControlID Propertysini degistirecegiz.
<cc1:ListSearchExtender ID="ListSearchExtender1" runat="server" TargetControlID="DropDownList1" PromptText="Arama yapmak için yaziniz..." PromptPosition="Top" PromptCssClass="modalPopup">
</cc1:ListSearchExtender>
Simdi bu yazdiklarimizi test edelim;
Simdi arama için bir şeyler yazalim; örnegin “ Sem ” : )
Simdi de diger DropdownList’ deneyelim;
Simdi arama yapmak için bir şeyler yazalim;
Gerçekten çok kullanisli ve ise yarayacak bir kontrol : ) Projelerinizde güle güle kullanin : )
Bu makalenin de sonuna geldik, baska bir makalede görüşmek üzere başarı ve iyi günler dilerim.
Sem GÖKSU
MCP | MCAD.NET | MCTS
Örnek Kodlar için mail adresimi kullanabilirsiniz
askisem@hotmail.com
Kaynaklar
http://ajax.asp.net