ASP.NET Kontrolleri - Placeholder ile Dinamik Kontrol Oluşturma

ASP.NET'te Placeholder'lar içerisine dinamik olarak Asp kontrollerini ekleyebiliriz.

Windows Formlar'da Formumuzun Load kısmında ekleyebildiğimiz kontrolleri ASP.NET'te ekleyemeyiz. Windows formlarında runat=server özelliği olan bir kontrol yoktur. Asp tarafında bu şekilde bir hata alacağız.

Örnek olarak Bir sinema işlettiğimizi düşünelim.Sinemamızda 3 adet farklı oturma düzeni olan salonumuz olsun. DropDownList'ten seçtiğimiz salona göre oturma düzenimiz oluşsun. Oturma düzenimizde dinamik olarak buton ve literal oluşturuyoruz.

Salon 1 için yazdığımız kodlarımız... Her 5 butonda bir alt satıra geçmeyi sağlayan Literal kontrolümüzü yazdık. Literal kontrolü ile kod tarafında HTML kodları yazabiliriz.Literal'in Text özelliğine verdiğimiz <br/>  ile satır atladık

  int ustUzaklik = 30;
        protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)
        {
            if (DropDownList1.SelectedIndex == 0) //SALON 1
            {
                Literal[] l = new Literal[3];
                Button[] btn = new Button[15];
                for (int i = 0; i < btn.Length; i++)
                {
                    btn[i] = new Button();
                    btn[i].ID = i.ToString();
                    if (Convert.ToInt32(btn[i].ID) % 5 == 0)
                    {
                        l[i / 5] = new Literal();
                        l[i/5].Text = "<br/>"

                        PlaceHolder1.Controls.Add(l[i/5]);
                        ustUzaklik += 70;
                        btn[i].Style["margin-top"] = "5px";
                    }
                    btn[i].Width = 50;
                    btn[i].Height = 50;
                    btn[i].Text = (i+1).ToString();
                    btn[i].Style["Top"] = ustUzaklik.ToString() + "px";
                    btn[i].Style["Left"] = "30px";
                    btn[i].Style["margin-left"] = "5px";                    
                    PlaceHolder1.Controls.Add(btn[i]);                    
                }
            }

Salon 2 için yazdığımız kodlar. Her 5 butonda bir alt satıra geçerken, 2. butondan sonra 60px sol taraftan boşluk bıraktık.

 else if (DropDownList1.SelectedIndex == 1)//SALON 2
            {             
                Literal[] l = new Literal[4];
                Button[] btn = new Button[20];
                for (int i = 0; i < btn.Length; i++)
                {
                    btn[i] = new Button();
                    btn[i].ID = i.ToString();
                    btn[i].Style["margin-left"] = "5px";
                    btn[i].Width = 50;
                    btn[i].Height = 50;
                    btn[i].Style["Top"] = ustUzaklik.ToString() + "px";
                    btn[i].Style["Left"] = "30px";


                    if (Convert.ToInt32(btn[i].ID) % 5 == 0)
                    {
                        l[i / 5] = new Literal();
                        l[i / 5].Text = "<br/>"

                        PlaceHolder1.Controls.Add(l[i / 5]);
                        ustUzaklik += 70;
                        btn[i].Style["margin-top"] = "5px";
                    }
                   
                    if (Convert.ToInt32(btn[i].ID) % 5 == 2)
                    {
                        btn[i].Style["margin-left"] = "60px";
                    }
                    btn[i].Text = (i+1).ToString();
                    PlaceHolder1.Controls.Add(btn[i]);
                }
            }

Salon 3 için yazdığımız kodlar 1. ve 4. butondan sonra 60px'lik boşluk bıraktık ve her 5 butonda bir  satır atladık.2. satırdan sonra ise iki adet boşluğumuzu Literal kontrolü ile bıraktık.

      else if (DropDownList1.SelectedIndex == 2)//SALON 3
            {
                 
                Literal[] l = new Literal[5];
                Button[] btn = new Button[25];
                for (int i = 0; i < btn.Length; i++)
                {
                    btn[i] = new Button();
                    btn[i].ID = i.ToString();
                    btn[i].Style["margin-left"] = "5px";
                    btn[i].Width = 50;
                    btn[i].Height = 50;
                    btn[i].Style["Top"] = ustUzaklik.ToString() + "px";
                    btn[i].Style["Left"] = "30px";

                    if (Convert.ToInt32(btn[i].ID) % 5 == 0)//Satır
                    {
                        l[i / 5] = new Literal();
                        l[i / 5].Text ="<br/>"
                        if (i/5==2)
                        {
                            l[i / 5].Text = "<br/><br/>"
                        }
                        PlaceHolder1.Controls.Add(l[i / 5]);
                        ustUzaklik += 70;
                        btn[i].Style["margin-top"] = "5px";
                    }

                    if (Convert.ToInt32(btn[i].ID) % 5 == 1  || Convert.ToInt32(btn[i].ID) % 5 == 4)
                    {
                        btn[i].Style["margin-left"] = "60px";
                    }
                    btn[i].Text = (i+1).ToString();
                    PlaceHolder1.Controls.Add(btn[i]);
                }
            }

Oluşturduğumuz her bir kontrolü placeholder'a Controls.Add() metodu ile ekledik.Butona Style özelliği ile stil verdik.

Kullandığımız kontrolleri tanıyacak olursak;

Buton, web,windows formlarda iş yaptırmayı sağlayan ve temel olarak Click eventi olan bir kontroldür.
Literal, Codebehind'de HTML kodu yazmamızı sağlayan ve browser'da sayfa kaynağını görüntüle dediğimizde HTML kodlarını görebildiğimiz koddur. Normal şartlarda kod tarafında yazdığımız kodları sayfa kaynağını görüntüle dediğimizde göremeyiz.
DropDownList ise aşağı doğru açılan kontroldür.Bu kontrolün temel eventi SelectedIndexChanged olup SelectedIndex,SelectedText,SelectedValue ile işlemler yapabiliriz.

Çıktılarımız