Merhabalar. Bu yazımda Ajax da Collapsiblepanelextender kontrolünün kullanımı göreceğiz. Bir paneli, sayfadaki herhangi bir kontrol ile açmaya ve kapatmaya yarayan bir kontrol. Varsayılan default ayarlarınki kodu aşağıdaki gibidir.
<cc1:CollapsiblePanelExtender
ID="CollapsiblePanelExtender1"
runat="server">
TargetControlID="Panel1"
</cc1:CollapsiblePanelExtender>
Şimdi bu kontrolümüzün özelliklerini kullanmaya başlayalım ve ortaya kullanışlı güzel bir kontrol çıkaralım. Hangi özelliğin ne işe yaradığını yanlarına yazacağım.
Öncelikle sayfamıza Bir linkbutton ve bir panel koyalım. (Linkbutton yerine istediğiniz bir kontrolü koyabilirsiniz.) Panelin içerisine istediğiniz şeyleri ekleyebilirsiniz. Ben bir tane resim ekledim. Altınada bir tane Collapsiblepanelextender kontrolü ekliyoruz.
Şimdi source kısmına girerek özelliklerini verebiliriz.
<cc1:CollapsiblePanelExtender ID="Colla" runat="Server"
TargetControlID="Panel3" //Burada hangi panelin açılacağını belirliyoruz.
CollapsedSize="0" //Panel küçüldüğünde alacağı piksel değeri.
ExpandedSize="300" //Panel büyültüldüğünde alacağı piksel değeri
Collapsed="True" // Panel küçüksel büyütülmesini,değilse küçültülmesini sağlar.
ExpandControlID="LinkButton1" //Paneli büyültecek olan kontrol
CollapseControlID="LinkButton1" //paneli küçültecek olan kontrol
AutoCollapse="False" //Mause panel üzerinden ayrılınca daralsınmı olayı
AutoExpand="False" //mause panel üzerine gelince panel açılsınmı olayı
ScrollContents="false" //Panel sığmıyorsa kaydırma çubukları çıksınmı
TextLabelID="LinkButton1" //panelin durumunun yazılacağı kontrol
CollapsedText="Ayrıntıları Göster" //TextLabelId özelliğinde belirtilen kontrole panel kapalıysa yazılacak özellik
ExpandedText="Ayrıntıları Gizle" //TextLabelId özelliğinde belirtilen kontrole panel açıksa yazılacak özellik
ImageControlID="Image1" //Buda TextLanelId gibi resim gostermek için
ExpandedImage="" // panel kapalıysa ImageControlId deki kontrolere getirilecek olan resim
CollapsedImage="" //panel açıksa ImageControlId deki kontrolere getirilecek olan resim
ExpandDirection="Vertical" /> //panelin ne tarafa açılıp kapanacağı
Burada hep açıp kapatma tabirini kullandım. Fakat isterseniz kapatmayabilir sadece kücültebilirsiniz. Aklınızda bulunsun 
Uygulamamızı çalıştırdığımızda gördüğünüz gibi LinkButton otomatik olarak Ayrıntıları göster oldu, çünkü Panel açık değil henüz.
Tıklayıp paneli açtığımızda ise Ayrıntıları gizle olarak değişti ve aşağıdaki panel göründü, dolayısıyla panelin içindeki resimde
Bir sonraki yazılarımda görüşmek üzere?