ASP.NET 4.0 – Kontroller için ClientIDMode Özelliği (tr-TR) - TechNet Articles - United States (English)

Merhaba arkadaşlar, bu makalemiz de ASP.NET 4.0 ile birlikte gelecek olan ClientIDMode özelliğini inceliyor olacağız...

ASP.NET de kontroller render edildikten sonra bir ID değeri alıyor ve bu ID değeri tüm kontroller için benzersiz oluyor. Bu yüzden, eğer kontrol UserControl yada MasterPage içerisindeyse kontrol'ün ID'si UserControlAdi_KontrolAdi şeklinde uzun bir isme sahip oluyor. Bu şekilde özellikle istemci taraflı geliştirme yaparkan(Javascript, JQuery vs.) bu kontrollere erişmek çok zor oluyor ve uygulamayı geliştiren kişinin geliştirme süresini uzatıyordu.

ASP.NET 4.0 Öncesi ve Read-Only ClientID Özelliği
Aslında ASP.NET içerisinde her kontrolün ClientID isimli read-only bir propertysi var. Bu property ile kontrolün alacağı ID’ye erişebiliyoruz. Fakat kontrolü bir user control içerisine taşırsak WebUserControl1_lblClientID gibi bir ClientID’ye sahip oluyor. Bu da istemci tarafında yapılan işlemi ve süreci etkiler, yapılan işlemin hatalı olmasına neden olur. Çünkü eğer harici bir dosya içinde İstemci taraflı işlemler yapılıyorsa orada da ilgili değişikliğin yapılması gerekir.

ASP.NET 4.0 Öncesi ClientID Özelliği
Response.Write(KonrolAdi.ClientID);
KonrolAdi.ClientID = “Atanamaz”; // => Read only bir özellik, atama yapılamaz !

ASP.NET 4.0 Yaklaşımı ve ClientIDMode Özelliği
İstemci taraflı geliştirmenin web uygulamalı içerisinde kullanımın artmasıyla birlikte bu sorunu aşmak için ASP.NET 4.0 ile birlikte kontrollere ClientIDMode isimli bir özellik eklendi. Bu özellik kontrol render edildikten sonra kontrolün alacağı ClientID değerinin istediğimiz gibi atanmasını sağlıyor. Yani ClientID’nin değeri eskiden olduğu gibi uzunca bir değer olabilir, bizim vereceğimiz her hangi bir değer olabilir ya da kontrol’ün ID’si ile aynı olabilir.

ClientIDMode özelliğinin alabileceği 4 özellik var. Bunlar Legacy (varsayılan değer), Inherit, Static, Predictable.

Legacy
ClientIDMode’un default değeridir. Eğer ClientIDMode özelliğine Legacy’i enum’u set edilmişse kontrolün alacağı ID değeri önceki sürümlerde olduğu gibidir. Yani uzunca bir ClientID oluşur :)

Örnek Kullanımı
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
<asp:Label ID="lblSample" ClientID="lblSample" ClientIDMode="Legacy" runat="server" Text="Yunus"></asp:Label>
</asp:Content>

Html Çıktısı
Yunus

Inherit
Her kontrol için default davranış gösterir. İçerisinde yer aldığı parent kontrolün ClientIDMode property’si ne olarak belirlenmişse, kontrol içinde o özellik atanır. Örneğin bir MasterPage ve Content sayfası var. Content sayfanın içinde de bir Label var. Master Page içerisindeki ContentPlaceHolder'ın ClientIDMode özelliği static ise Content sayfa içerisinde yer alan kontrolün özelliği de static olarak belirlenir.

Örnek Kullanımı

Master Page
<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server" ClientIDMode="Static"> </asp:ContentPlaceHolder>

Content
<asp:Label ID=" lblSample" ClientID="lblInheritSample" ClientIDMode="Inherit" runat="server" Text="Yunus"></asp:Label>

Html Çıktısı
Yunus // Parent Kontrolün(Content) ClientIDMode özelliği static olduğu için içteki kontrolünde ClientIDMode özelliği static olarak atandı…

Static
Bu mod seçildiğinde, kontrolün ClientID’ne ne atamışsak oluşacak olan HTML çıktısına da o değer atanır. Burada dikkat edilmesi gereken şey, ClientID’nin benzersiz olduğundan emin olmak zorundayız. Yani elimizde 2 User Control var. Her ikisi içinde de bir label olduğunu düşünürsek iki label’ın CleintID’si farklı olması gerekir. Eğer ikisi de aynı olursa, client site de yapacağımız işlemler de yanlış sonuçlar alabiliriz. Özellikle de databound kontrollerinden kullanmamak gerekir.

Örnek Kullanımı
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
<asp:Label ID=" lblSample" ClientID=”lblClientSample" ClientIDMode="Static" runat="server" Text="Yunus"></asp:Label>
</asp:Content>

Html Çıktısı
Yunus

Predictable
Bu özellik, Gridview, Repeater gibi DataBound kontroller için daha kullanışlıdır. Burada işe yarayacak bir diğer property de RowClientIDSuffixözelliğidir. Bu özellik ile DataBound kontrolünün kolonu içerisinde yer alan kontrolün ClientID’nin değerinin sonuna takı olarak belirttiğimiz alanın değeri eklenir.

Örnek Kullanımı
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false" ClientIDMode="Predictable" RowClientIDSuffix="UrunAdi"> // RowClientIDSuffix özelliğine veri kaynağından gelen bir alan yazmak zorundayız. Birden fazla kontrol için yapacaksak alanları virgül ile ayırabiliriz.
<Columns>
<asp:TemplateField>
<ItemTemplate>
<asp:Label ID="lblUrunAdi" runat="server" Text='<%# Eval("UrunAdi") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>

Html Çıktısı
<table cellspacing="0" rules="all" border="1" id="ctl00_ContentPlaceHolder1_GridView1" style="border-collapse:collapse;">
<tr><th scope="col"> </th></tr><tr><td>
Kalem
</td></tr><tr><td>
Defter
</td></tr><tr><td>
Silgi
</td></tr><tr><td>
Dosya Kağıdı
</td></tr>
</table>

Eğer ClientIDMode özelliğini Predictable yapmasaydık,
<table cellspacing="0" rules="all" border="1" id="ctl00_ContentPlaceHolder1_GridView1" style="border-collapse:collapse;">
<tr><th scope="col"> </th></tr><tr><td>
Kalem
</td></tr><tr><td>
Defter
</td></tr><tr><td>
Silgi
</td></tr><tr><td>
Dosya Kağıdı
</td></tr>
</table>