Asp.Net
12
Eki
2011
Asp.Net TreeView
Kategori : Asp.NetCssLiteralControlRecursive
Ekleyen : Admin
Merhaba Arkadaşlar, Bugün sizlere; Ağaç Menü, Sınırsız AltKategori, Sonsuz AltKategori olarakta adlandırılan :) TreeView Menü nasıl yapılır ve yapılan bu menüye css nasıl uygulanır, bunlarla ilgili bilgiler vereceğim. Geliştireceğimiz uygulamada Access veritabanı kullanacağız. Menüyü oluşturmak için yazacağımız metod; Recursive Metod ( Yinelenen Metod )'tur. Projenin tamamına makale sonundaki linkten erişebilirsiniz.
Yukarıda gördüğünüz veritabanımızın olması gereken şeklidir. Veritabanındaki kolonlarımız kategoriId int tipinde otomatik artan ve tekrarlanmayan bir alan, kategoriAdi kategori isminin bulunacağı yazı kolonu ve ustId yine int tipinde; veritabanımızdaki en kritik alan diyebiliriz, menümüz ustId alanına göre şekillenecek, bu yapıyı anlatmak gerekirse; kategorilerimizde üstte olması gereken alanları yani başlıkları ustId bölümünde 0 (sıfır) olarak belirtmeliyizki yazacağımız metodta ustId si 0 (sıfır) olan alanları üste çıkartsın. Veritabanımızı kısaca inceledikten sonra projemize başlayabiliriz.
Default.aspx sayfamıza bir placeholder ekliyoruz eklediğimiz bu placeholder kodtarafında doldurulacak
   1:  <asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
   2:   
   3:      <h2>Asp.Net TreeView " Css "</h2>
   4:      <asp:PlaceHolder ID="treeMenu" runat="server"></asp:PlaceHolder>
   5:   
   6:  </asp:Content>
Default.aspx.cs sayfamızın kod tarafına geçiyoruz ve metodumuzu yazmaya başlıyoruz.
   1:  protected void Page_Load(object sender, EventArgs e)
   2:      {
   3:          if (!Page.IsPostBack)
   4:          {
   5:              MenuDoldur();
   6:          }
   7:      }
   8:   
   9:      public DataSet Veriler(string komut)
  10:      {
  11:          OleDbConnection con = new OleDbConnection(ConfigurationManager.ConnectionStrings["treeCon"].ConnectionString);
  12:          OleDbDataAdapter da = new OleDbDataAdapter(komut,con);
  13:          DataSet ds = new DataSet();
  14:          da.Fill(ds);
  15:   
  16:          return ds;
  17:      }
Page_Load içinde sayfamızın postback'ten etkilenmesini önlemek için postback kontrolü oluşturduk ve metodumuzu çağırdık. Altında ise geriye Dataset döndüren ve string parametre (oledb command) alan bir metod tanımladık.
   1:  private void MenuDoldur()
   2:      {
   3:          treeMenu.Controls.Clear();
   4:          DataSet ds = Veriler("Select * From Kategoriler");
   5:          treeMenu.Controls.Add(new LiteralControl("<ul id='treeMenu'>"));
   6:          foreach (DataRow dr in ds.Tables[0].Rows)
   7:          {
   8:              if ((int)dr["ustId"] == 0)
   9:              {
  10:                  treeMenu.Controls.Add(new LiteralControl("<li><a href='#'>" + dr["kategoriAdi"].ToString() + "</a>"));
  11:                  int Id = (int)dr["kategoriId"];
  12:                  altDoldur(Id);
  13:              }
  14:          }
  15:          treeMenu.Controls.Add(new LiteralControl("</ul>"));
  16:      }
MenuDoldur Metodumuzda ise üst kısımda oluşturduğumuz geriye DataSet Döndüren string parametre alan metodumuza gönderme yapıyoruz ve kategoriler tablosundaki verileri DataSet üzerine alıyoruz, aldığımız verilerin içinde foreach ile DataRow tipinde dönüyoruz üstId'si 0 (sıfır) a eşit olan kategorileri if kontrolü ile alıp altDoldur metodumuza gönderiyoruz.
   1:  private int altDoldur(int kategoriId)
   2:      {
   3:          DataSet ds = Veriler("Select * From Kategoriler Where ustId=" + kategoriId);
   4:   
   5:          if (ds.Tables[0].Rows.Count > 0)
   6:          {
   7:   
   8:              treeMenu.Controls.Add(new LiteralControl("<ul>"));
   9:              foreach (DataRow dr in ds.Tables[0].Rows)
  10:              {
  11:                  treeMenu.Controls.Add(new LiteralControl("<li><a href='#'><span>" + dr["KategoriAdi"].ToString() + "</span></a>"));
  12:                  int id = (int)dr["kategoriId"];
  13:                  altDoldur(id);
  14:              }
  15:              treeMenu.Controls.Add(new LiteralControl("</ul>"));
  16:              treeMenu.Controls.Add(new LiteralControl("</li>"));
  17:              return 0;
  18:          }
  19:          treeMenu.Controls.Add(new LiteralControl("</li>"));
  20:          return 0;
  21:      }
altDoldur isimli Metod bizim Recursive Metodumuz (Yinelenen) aldığı int tipindeki parametre ile geriye dataset döndüren (Veriler) isimli metodumuza (Where) ile istekte bulunuyoruz, istek sonucunda if koşul ifadesiyle satır sayısı 0 (sıfır) dan büyük ise yine foreach ile datarow tipinde dataset içinde dönüyoruz her dönüşte altDoldur metodumuza istekte bulunuyoruz taki veritabanındaki en alt elemana ulaşanakadar.
Default.aspx.cs
   1:  public partial class _Default : System.Web.UI.Page
   2:  {
   3:      protected void Page_Load(object sender, EventArgs e)
   4:      {
   5:          if (!Page.IsPostBack)
   6:          {
   7:              MenuDoldur();
   8:          }
   9:      }
  10:   
  11:      public DataSet Veriler(string komut)
  12:      {
  13:          OleDbConnection con = new OleDbConnection(ConfigurationManager.ConnectionStrings["treeCon"].ConnectionString);
  14:          OleDbDataAdapter da = new OleDbDataAdapter(komut,con);
  15:          DataSet ds = new DataSet();
  16:          da.Fill(ds);
  17:   
  18:          return ds;
  19:      }
  20:   
  21:      private void MenuDoldur()
  22:      {
  23:          treeMenu.Controls.Clear();
  24:          DataSet ds = Veriler("Select * From Kategoriler");
  25:          treeMenu.Controls.Add(new LiteralControl("<ul id='treeMenu'>"));
  26:          foreach (DataRow dr in ds.Tables[0].Rows)
  27:          {
  28:              if ((int)dr["ustId"] == 0)
  29:              {
  30:                  treeMenu.Controls.Add(new LiteralControl("<li><a href='#'>" + dr["kategoriAdi"].ToString() + "</a>"));
  31:                  int Id = (int)dr["kategoriId"];
  32:                  altDoldur(Id);
  33:              }
  34:          }
  35:          treeMenu.Controls.Add(new LiteralControl("</ul>"));
  36:      }
  37:   
  38:      private int altDoldur(int kategoriId)
  39:      {
  40:          DataSet ds = Veriler("Select * From Kategoriler Where ustId=" + kategoriId);
  41:   
  42:          if (ds.Tables[0].Rows.Count > 0)
  43:          {
  44:   
  45:              treeMenu.Controls.Add(new LiteralControl("<ul>"));
  46:              foreach (DataRow dr in ds.Tables[0].Rows)
  47:              {
  48:                  treeMenu.Controls.Add(new LiteralControl("<li><a href='#'><span>" + dr["KategoriAdi"].ToString() + "</span></a>"));
  49:                  int id = (int)dr["kategoriId"];
  50:                  altDoldur(id);
  51:              }
  52:              treeMenu.Controls.Add(new LiteralControl("</ul>"));
  53:              treeMenu.Controls.Add(new LiteralControl("</li>"));
  54:              return 0;
  55:          }
  56:          treeMenu.Controls.Add(new LiteralControl("</li>"));
  57:          return 0;
  58:      }
  59:  }
PlaceHolder kontrolümüze pek değinmedim umarım kod içinde incelerken ne işe yaradığını veya araştırarak neiş yaptığını öğrenebilirsiniz :) kolay gelsin.
   1:  <b>treeMenu.Controls.Add(new LiteralControl("</ul>"));</b>
Başka bir makalede görüşmek dileğiyle Hoşçakalın.

Not: Css kodlarıyla oynayarak renk ve biçim değişikliği yapabilirsiniz.
Örnek Proje : TreeviewMenu
Update: 28.05.2013 - Asp.Net 4.0 ile Url Routing Özelliği Eklenmiştir.
Örnek Proje : TreeviewMenu Asp.Net 4.0 Url Routing
21 Ekim Cum, 2011 Erman ..
Tebrik ederim, eline sağlık. Senin gibi güzel paylaşımlarda bulunan, örnek paylaşan arkadaşlara ihtiyacımız var. Fırsat bulduğum anda ben de başlayacağım inşallah ;)
21 Ekim Cum, 2011 Admin
Teşekkürler, darısı başınıza diyelim ozaman :)
21 Ekim Cum, 2011 Fuat Gonulkırmaz
Degerli Zekeriya Hocam makale cok güzel ve açıktı.. Aklına sağlık.. Tesekkurler.. :=)
21 Ekim Cum, 2011 Admin
Teşekkürler :)
03 Kasım Per, 2011 Mirsat Tekin
Güzel Paylaşım ... Teşekkürler :)
04 Kasım Cum, 2011 Zekeriya ALAN
Ben Teşekkür ederim :)
25 Kasım Cum, 2011 onur han
çok iyi bir anlatım olmuş hocam, teşekkürler, bir sorum olucak konu ile ilgili: şimdi bu sistemi kullanarak bir ürün listeleme yaptım, ilave olarak bir ürün tablosu daha ekledim ürün i si ürün adı be kategoriId ... gibi kolonlarım mevcut. kategorId ile de ilişkiyi belirttim. linkleri de hazırladım, mevcut linkleri ; <li class=''><a href='urunDetay.aspx?urunno=" + dr["kategoriId"].ToString() + "'>" + dr["kategoriAdi"].ToString() + "</a>" şeklinde bağladım, gönderiğim idyi diğer sayfada baz alarak kategori id si gönderilen querystringle aynı olanları listeledim. ancak şöyle bir eksiklik mevcut, ben bu sistemde sadece kategori ve o kategorilere ait alt kategorileri listeleyebiliyorum, kategoriye ait ürünleri açılır menüde link olarak gösteremiyorum, bu sistemi belirttiğim şekilde nasıl modifiye edebiliriz acaba? mesela müzik tıklandığında gönderilen sayfada Tarkan - Serdar Ortaç - Gülşen Listelenicek, Gülşen tıklandığında açılan sayfada Of Off - Önsöz listelenecek, Yukarıdan Ayarlı tıklandığında detayları direkt açılacak....
26 Kasım Cmt, 2011 Zekeriya ALAN
Öncelikle teşekkürler,
Yapmak istediğinize gelince; siz sanırım kategoriId lere göre gidiyorsunuz. İstediğiniz şekilde yapmak için üstId degerlerine göre sorgularınızı yazmalısınız.
21 Mayıs Pzt, 2012 özkan
Paylaşım için teşekkürler, elinize sağlık..
25 Şubat Pzt, 2013 Mustafa
Hocam harika. Fazlasıyla teşekkür ederim beni büyük bir sorundan kurtardınız. Şimdi bunu sadece uygun css yerleştirip yatay biçimde kullanılması kaldı. Teşekkürler,teşekkürler,teşekkürler.
26 Şubat Sal, 2013 Admin
Rica ederim, faydam dokunduysa ne mutlu bana.
27 Mayıs Pzt, 2013 tolga demir
merhaba hocam çok araştırmama rağmen sonsuz kategori menü yapımını senin bu makalende bulabildim bunun için sana ne kadar teşekkür etsem azdır. Projeyi kodda küçük değişiklikler yaparak başka bir menüye uyarladım fakat yapamadığım bir şey var oda bu sisteme url routing sistemini entegre edemedim biraz bilgi verirsen çok sevinirim. Kolay gelsin
28 Mayıs Sal, 2013 Zekeriya ALAN
Merhaba, Projeye Url Routing Özelliği Ekleyerek Yeniden Paylaştım. Umarım fikir edinmenizi sağlar.
iyi çalışmalar.
10 Ağustos Cmt, 2013 yakup
hocam bu konuda en iyi açıklamayı siz yapmışsınız çok teşekkür ederim .. ama bir hata alıyorum treeMenu.Controls.Add(new LiteralControl("id='treeMenu'")); hata burada gösteriyor hata ise = 'System.Web.UI.WebControls.TreeView' does not allow child controls. bu projeyi indirip açtığımda sorunsuz çalışıyor ama benim projemde kullanmaya kaltığımda böyle bir hata veriyor. yardımcı olursanız sevinirimm.
13 Ağustos Sal, 2013 Zekeriya ALAN
LiteralControl içinde html taglarını belirtmelisin; Örn :
 LiteralControl("<li id='"+ id +"'></li>")
.. şeklinde Kullanabilirsiniz.
29 Mart Cmt, 2014 Cihangir
Merhaba çok fazla kategori olduğunda sayfanın en altında kalan kategorinin alt kategorileri görünmüyor. Bunu nasıl düzeltebiliriz ? Css ile ilgili bir sıkıntı baktım ama düzeltemedim. Teşekkürler