DropDownList (Açılır Liste) Kontrolü

Eyl 06, 2013

DropDownList (Açılır Liste) kontrolü site içerisindeki işlevselliği ve geliştiriciye sağladığı gelişme ortamı ile birçok gelişmiş Web sitesinde kullanılmaktadır. Genellikle şehir, yaş aralığı, cinsiyet, kategori gibi çeşitli listelemeler yapmak için kullanılır. DropDownList (Açılır Liste) kontrolünde listedeki veriler .cs kısmından eklenebileceği gibi, .aspx kısmından da eklenebilir.

Uygulama

Uygulama kısmında birinci listeye 4 tane fakülte eklendi ve diğer bir listeye de bu fakültelere ait bölümler eklendi. İlk listeden seçilen fakülteye ait bölümlerin ikinci listede açılması sağlandı.       

.aspx sayfasına DropDownList kontrolü ile fakülte isimlerinin yerleştirilmesi:

<asp:DropDownList ID="ddlFakulte" runat="server"     OnSelectedIndexChanged="ddlFakulte_OnSelectedIndexChanged"   AutoPostBack="true">  <asp:ListItem>Fakülte Seçiniz</asp:ListItem>
        <asp:ListItem Value="1">İnşaat Fakültesi</asp:ListItem>
        <asp:ListItem Value="2">Mimarlık Fakültesi</asp:ListItem>
        <asp:ListItem Value="3">Makina Fakültesi</asp:ListItem>
        <asp:ListItem Value="4">Elektrik-Elektronik Fakültesi</asp:ListItem>
     </asp:DropDownList>
     <asp:DropDownList ID="ddlBolum" runat="server"></asp:DropDownList>

.cs sayfasına DropDownList kontrolü ile bölüm isimlerinin yerleştirilmesi:

    protected void Page_Load(object sender, EventArgs e)
    {
        ddlBolum.Enabled = false;
    }
    protected void ddlFakulte_OnSelectedIndexChanged(object sender, EventArgs e)
    {
        List<string> liste = new List<string>();
        liste.Add("Seçiniz");
        switch (ddlFakulte.SelectedItem.Value)
        {
            case "1":
                liste.Add("İnşaat Mühendisliği");
                liste.Add("Çevre Mühendisliği");
                liste.Add("Geomatik Mühendisliği");
                ddlBolum.Enabled = true;
                break;
            case "2":
                liste.Add("Mimarlık");
                liste.Add("Şehir ve Bölge Planlaması");
                liste.Add("Endüstri Ürünleri Tasarımı");
                liste.Add("İç Mimarlık");
                liste.Add("Peyzaj Mimarlığı");
                ddlBolum.Enabled = true;
                break;
            case "3":
                liste.Add("Makina Mühendisliği");
                liste.Add("İmalat Mühendisliği");
                ddlBolum.Enabled = true;
                break;
            case "4":
                liste.Add("Elektronik ve Haberleşme Mühendisliği");
                liste.Add("Elektrik Mühendisliği");
                liste.Add("Elektronik Mühendisliği");
                liste.Add("Telekomünikasyon Mühendisliği");
                liste.Add("Kontrol Mühendisliği");
                ddlBolum.Enabled = true;
                break;
            default:
                ddlBolum.Enabled = false;
                break;
        }
        ddlBolum.DataSource = liste;
        ddlBolum.DataBind();
    }

  • Sayfa açıldığında gelen görüntü şekildeki gibidir:



  • Birinci DropDownList açıldığında fakülte isimleri listelenir.



  • Birinci listeden fakülte ismi seçildiğinde ikinci DropDownList aktif hale gelir.

  • İkinci DropDownList açıldığında seçilen fakültenin bölümleri listelenir.


  • Bölüm ismi de seçildikten sonra sayfanın son hali şekildeki gibi olur.