Sermin'in Bilgi Paylaşımı..

Bu yazımızda Ajax Kontrollerinden 'AutoComplateExtender' bileşeninin kullanımını bir örnek üzerinden anlamaya çalışacağız.
Senaryomuz textbox içerisine yazdığımız karakterlerin web servis üzerinde oluşturduğumuz char dizisi içerisinden rasgele olarak seçilenleri ile tamamlanmasını sağlamak.
Bu bileşeni ihtiyacımız doğrultusunda özelleştirerek veri tabanı üzerinden getireceğimiz verilerle de doldurabiliriz. Daha önceki yazılarımızda böylebir senaryo üzerinde durmuştuk.
VisualStudio içinde AJAXEnabledWebApplication olarak başlattığımız projemizin Default.aspx sayfası içerisindeki 'ScriptManager' bileşeni altına bir tane textbox, bir tanede AutoComplateExtender sürüklüyoruz. Daha sonra projemize Add New Item deyip bir tane WebService.asmx ekliyoruz. Bu sayfada text box içerisine girilen karaktarleri rasgeleleriyle tamamlamayı sağlayacak olan GetCompletionList metodunu yazacağız.

[WebMethod] public string[] GetCompletionList(string prefixText, int count) {       Random random = new Random();     List<string> items = new List<string>(count);     for (int i = 0; i < count; i++)     {         char c1 = (char)random.Next(65, 90);         char c2 = (char)random.Next(97, 122);         char c3 = (char)random.Next(97, 122);         items.Add(prefixText + c1 + c2 + c3);     }     return items.ToArray(); }

Görüldüğü gibi string bir dizi döndüren bir metot yazıyoruz. Bu dizi 3 elemanlı. 'c1' Ascii Kodu 65 ile 90 arasında (büyük harfler) olanlarından rasgele seçilmiş karakteri temsil ediyor. 'c2' ve 'c3' te aynı şekilde 97 ile 122 arasındakileri (küçük harfler).
Web servis içini yukarıdaki gibi düzenledikten sonra ScriptManager bileşenini aşağıdaki şekilde düzenliyoruz.

<asp:ScriptManager ID="ScriptManager1" runat="server">     <Services>         <asp:ServiceReference Path="~/WebService.asmx" />     </Services> </asp:ScriptManager>

AutoComplateExtender bileşeninin özelliklerinde de aşağıdaki düzenlemeyi yaptıktan sonra :

<cc1:AutoCompleteExtender ID="AutoCompleteExtender1" runat="server"     TargetControlID="TextBox1"     ServicePath="WebService.asmx"     ServiceMethod="GetCompletionList     MinimumPrefixLength="2" CompletionInterval="1000"     EnableCaching="true"     CompletionSetCount="12"> </cc1:AutoCompleteExtender> <asp:TextBox ID="TextBox1" runat="server"/>

Projemizi çalıştırabiliriz. 


Sayfa görüntümüz...
Umarım sizin için yararlı olur..

Bu yazıda, Textbox içine doldurulması istenen veriyi veritabanından getirerek otomatik tamamlamayı bir örnek üzerinden anlamaya çalışacağız.

Textbox üzerinde otomatik tamamlama birçok yerde karşımıza çıkar. Bunun ASP.NET AJAX içinde herhangi bir TextBox Kontrolüne AutoCompleteExtender ekleyerek yapılabileceğinide biliriz. Kullanıcı Textbox içine yazmaya başladığında bir popup panel hareketli olarak kullanıcıya ilişkili sözcükleri getirir. Kullanıcı bu panelden istediği sözcüğü seçebilir. Şimdi WebService yardımı ile veri tabanından verileri nasıl getireceğiz ona balkalım.

Başlangıç olarak VisualStudio açarak, AJAXEnabledWebApplication olacak şekilde projemizi başlatıyoruz. Default.aspx sayfası içine bir tane TextBox birtane de AutoCompleteExtender sürüklüyoruz. Projeye bir tane WebService.asmx ekliyoruz. Yapacağımız ilk şey WebService.asmx.cs içine;

using System.Web.Script.Services; [ScriptService]

referansını eklemek olmalı. Daha sonra 'SehirleriGetir' web metodu ile Sehir tablosundaki verileri alacağız.

private string cnstr = ConfigurationManager.ConnectionStrings["SehirConnectionString"].ConnectionString; private string sql = string.Empty; [WebMethod] public string[] SehileriGetir(string onText) {     string sql = "Select * From Sehir Where Sehir_Adi like @onText";     SqlDataAdapter da = new SqlDataAdapter(sql, cnstr);     da.SelectCommand.Parameters.Add("@onTexst", SqlDbType.VarChar, 50).Value = onText + "%";     DataTable dt = new DataTable();     da.Fill(dt);     string[] items = new string[dt.Rows.Count];     int i = 0;     foreach (DataRow dr in dt.Rows)     {         items.SetValue(dr["Sehir_Adi"].ToString(),i);         i++;     }     return items; }

Yukarıdaki webmethod içinde tutulan onText değişkeni, veri tabanından getirilecek olan veri ile ilişkili sözcükleri sorgulamak için gereklidir. Sql sorgusu ise bir strin dizi olarak sonuç döndürür.

Şimdi Default.aspx sayfası içine bir tane AutoCompleteExtender Kontrolü sürükleyerek özelliklerini aşağıdaki gibi düzenleyelim

<cc1:AutoCompleteExtender ID="AutoCompleteExtender1" runat="server"     MinimumPrefixLength="1" ServiceMethod="SehirleriGetir"     ServicePath="WebService.asmx" TargetControlID="TextBox1"> </cc1:AutoCompleteExtender>

MinimumPreferixLength : Otomatik tamamlama işi kaç karakter yazdıktan sonra başlasın.
ServiceMethod : Tetiklendiği anda hangi method çağırılsın.
ServicePath : Methodun yolu.
TargetControlID : Tetikleme hangi kontrolle başlatılsın.

Projemizi çalıştırdığımızda karşımıza gelen sayfada texbox içine ilk harfimizi yazdığımızda o harfle başlayan veri tabanındaki şehirlerin kusursuz bir şekilde, popup bir kutuda sıralandığını göreceğiz.
Umarım sizin için yaralı olmuştur..