6 Aralık 2011 Salı

Asp.net Ajax CascadingDropDown

   CascadingDropDown  bir ASP.NET DropDownList kontrolüyle ilişkilendirilerek kullanılan bir AJAX extender türüdür. DropDownList içerisindeki değerleri adeta bir süzgeç süzer. Genellikle birden fazla DropDownList bir arada kullanılır. Seçilen bir değer diğer kontrolü etkiler. 

   Örneğin il, ilçe ve semt bilgilerini 3 tane DropDownList ve ilişkilendirilmiş CascadingDropDown kontrolleriyle kullandığımızı varsayalım. İl alanını seçtiğimizde ilçe alanında sadece o ile ait ilçeler gösterilecektir. Aynı şekilde ilçe değerini seçtiğimizde de o ilçeye ait semtler gösterilecektir. Yani bir filtreleme söz konusu.

   İl, ilçe ve semt bilgilerini filtrelenerek gösterildiği bir örnek üzerinden gidelim:


 İl : 
        <asp:DropDownList ID="DropDownListIl" runat="server">
        </asp:DropDownList>
        <asp:CascadingDropDown ID="DropDownListIl_CascadingDropDown" runat="server" 
            Category="il" Enabled="True" ServicePath="ilIlceSemt.asmx" ServiceMethod="Getil" LoadingText="iller yükleniyor..." 
            PromptText="Lütfen bir il seçiniz..." TargetControlID="DropDownListIl">
        </asp:CascadingDropDown>
        <br />
        <br />
        İlçe :
        <asp:DropDownList ID="DropDownListIlce" runat="server">
        </asp:DropDownList>
        <asp:CascadingDropDown ID="DropDownListIlce_CascadingDropDown" runat="server" 
            Category="ilce" Enabled="True" LoadingText="ilçeler yükleniyor..." 
            ParentControlID="DropDownListIl" PromptText="Lütfen bir ilçe seçiniz..." 
            TargetControlID="DropDownListIlce" ServiceMethod="GetileGoreIlce" 
            ServicePath="ilIlceSemt.asmx">
        </asp:CascadingDropDown>
        <br />
        <br />
        Semt :
        <asp:DropDownList ID="DropDownListSemt" runat="server">
        </asp:DropDownList>
        <asp:CascadingDropDown ID="DropDownListSemt_CascadingDropDown" runat="server" 
            Category="semt" Enabled="True" LoadingText="semtler yükleniyor..." 
            ParentControlID="DropDownListIlce" PromptText="Lütfen bir semt seçiniz..." 
            TargetControlID="DropDownListSemt" ServiceMethod="GetilceyeGoreSemt" 
            ServicePath="ilIlceSemt.asmx">
        </asp:CascadingDropDown>


Özellikler:



  • TargerControlID - Yerleştirilecek DropDownList kontrolünün ID değerini veriyoruz. Örneğin : DropDownListIl
  • Category - İlgili DropDownList kontrolünün kategori adı. Örneğin : il
  • PromptText - Kullanıcı DropDownList kontrolünden bir değer seçmeden önce gösterilen metin değeridir. Örneğin : Lütfen bir il seçiniz. (Tercihen kullanılabilir)
  • PromptValue - PromptText gösterildiğinde ayarlanan değer. Bu değer kullanıldığında servis metodlarının ona göre belirlenmesi gerekir. Yoksa hata verebilir.(Tercihen kullanılabilir)
  • EmptyText - DropDownList kontrolünün gösterecek verisi olmadığında tercihen kullanılabilecek bir metin değeridir.
  • EmptyValue - EmptyText gösterildiğinde ayarlanan bir değerdir. (Tercihen kullanılabilir)
  • LoadingText - DropDownList kontrolündeki değer yüklenirken gösterilen bir metindir. Örneğin : LoadingText = "iller yükleniyor..."
  • ServicePath - DropDownList kontrolüne yerleştirilmek üzere kullanılan verinin döndürüldüğü web servis metodunun yolu. ServisMethod bir page metot şeklinde tanımlanmışsa bu özellik null olmalı. Web servisin System.Web.Script.Services.ScriptService özelliği dekore edilmeli.
  • ServiceMethod - DropDownList kontrolüne gelen verinin döndürüldüğü servis metodu. Aşağıdaki formata uygun olmalıdır :
[System.Web.Services.WebMethod] 
[System.Web.Script.Services.ScriptMethod] 
public CascadingDropDownNameValue[] GetDropDownContents( string knownCategoryValues, string category) { ... }


Not : Methodun adı farklı olabilir ama dönen tip, parametre adları ve tipleri yukarıdaki formata uygun olmalı. Örneğin GetDropDownContents yerine Getil kullanılabilir.


  • ParentControlID - Bu DropDownList kontrolünü kontrol eden DropDownList kontrolünün ID değeri. Örneğin DropDownLisIl DropDownListIlce kontrolünün parent kontrolüdür ve DropDownListIlce kontrolünün içeriği DropDownList kontrolünden seçilen değere bağlıdır.(Tercihen kullanılabilir)
  • Selected Value - DropDownList kontrolü içerisinde varsayılan olarak seçilmesini istediğimiz değer varsa burada belirleyebiliriz. DropDownList kontrolümüzün içerisindeki değerlerden birisi olmalıdır. 
ilIlceSemt.asmx : 

[WebService(Namespace = "http://tempuri.org/")]
    [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
    [System.ComponentModel.ToolboxItem(false)]
    // To allow this Web Service to be called from script, using ASP.NET AJAX, uncomment the following line. 
    [System.Web.Script.Services.ScriptService]
    public class il : System.Web.Services.WebService
    {
        SqlConnection baglanti = new SqlConnection(WebConfigurationManager.ConnectionStrings["IlIlceSemtConnectionString"].ConnectionString);
        [System.Web.Services.WebMethod]
        [System.Web.Script.Services.ScriptMethod]
        public CascadingDropDownNameValue[] Getil(string knownCategoryValues, string category)
        {
           List<CascadingDropDownNameValue> values = new List<CascadingDropDownNameValue>();
           
            baglanti.Open();
            SqlCommand komut = new SqlCommand("select Ad, IlID from iller", baglanti);
            SqlDataReader reader = komut.ExecuteReader();              
            while (reader.Read())
            {
                values.Add(new CascadingDropDownNameValue(reader["Ad"].ToString(), reader["IlID"].ToString()));
                
            }
            
            baglanti.Close();
            return values.ToArray();
        }

        [System.Web.Services.WebMethod]
        [System.Web.Script.Services.ScriptMethod]
        public CascadingDropDownNameValue[] GetileGoreIlce(string knownCategoryValues, string category)
        {
            List<CascadingDropDownNameValue> values = new List<CascadingDropDownNameValue>();
            StringDictionary kv = AjaxControlToolkit.CascadingDropDown.ParseKnownCategoryValuesString(knownCategoryValues);
            baglanti.Open();
            int IlID = Convert.ToInt32(kv["il"]);
            SqlCommand komut = new SqlCommand("select Ad,IlceID from ilceler where IlID = " + Convert.ToInt16(IlID) + "", baglanti);
            SqlDataReader reader = komut.ExecuteReader();
            while (reader.Read())
            {
                values.Add(new CascadingDropDownNameValue((string)reader["Ad"], reader["IlceID"].ToString()));

            }
            baglanti.Close();
            return values.ToArray();
        }

        [System.Web.Services.WebMethod]
        [System.Web.Script.Services.ScriptMethod]
        public CascadingDropDownNameValue[] GetilceyeGoreSemt(string knownCategoryValues, string category)
        {
            List<CascadingDropDownNameValue> values = new List<CascadingDropDownNameValue>();
            StringDictionary kv = AjaxControlToolkit.CascadingDropDown.ParseKnownCategoryValuesString(knownCategoryValues);
            baglanti.Open();
            int IlceID;          
            
            if (!kv.ContainsKey("ilce") || !Int32.TryParse(kv["ilce"], out IlceID))
            {
                return null;
            }
            SqlCommand komut = new SqlCommand("select Ad,SemtID from semtler where IlceID = " + IlceID + "", baglanti);
            SqlDataReader reader = komut.ExecuteReader();
            while (reader.Read())
            {               
                    values.Add(new CascadingDropDownNameValue((string)reader["Ad"], reader["SemtID"].ToString()));     

            }
            baglanti.Close();
            return values.ToArray();
        }
    }


contextKey Özelliğinin Kullanımı

     ContextKey alanlarına Eval ile istediğim özellikleri bağlıyorum. 

ContextKey='<%# Eval("sehir") %>' UseContextKey="true" ). 

asmx uzantılı servis dosyamda da string contextKey alanını ekliyorum.

( public CascadingDropDownNameValue[] Getil(string knownCategoryValues, string category, string contextKey) )

values.Add(new CascadingDropDownNameValue(il_ad, reader["il_id"].ToString(),il_ad==contextKey));

   Yukarıda yapmaya çalıştığım şey aslında DetailsView içerisinde CascadingDropDown kullandığımızda güncelleme işlemi yaparken DropDownList kontrolünde daha önceden seçili olan verilerin gösterilmesidir. CascadingDropDown kullanmadan bu işlemi DropDownList kontrolünün SelectedValue özelliğine Bind yaparak gerçekleştirebilirsiniz. contextKey alanına farklı değerler atayarak farklı amaçlar için kullanabilirsiniz.Bu arada aşağıdaki uygulamada bu kısım yok.


İLGİLİ BAĞLANTILAR

  1. Ajax CascadingDropDown Extender- Method Error 500/12031