Update Panel (Ajax Nedir ? ) |
| |
Bir önceki makalemizde ajax ‘ ın genel olarak özelliklerinden bahsetmişti. Bu yazımda sizlere Update Panel kontrolünden ve uygulamalarımızda nasıl kullanabileceğimizden bahsedeceğim. |
| |
| Bu kontrol sayesinde , sayfamızda bölümler oluşturabilir ve bu bölümleri asenkron bir şekilde güncelleyebiliriz. Bu sayede sayfamızı PostBack işlemine tabi tutmamış oluruz, sayfamız hızlı çalışır ve sunucu ile istemci arasındaki trafiğide azaltmış oluruz. |
| |
| Kontrol içerisinde 2 farklı kısım vardır bu bölümlerin ilki görünmesini istediğimiz içeriğin girildiği bölümdür . Bu bölüm <ContentTemplate>İçerik</ContentTemplate> etiketleri ile sınırlanır,bu etiketler arasına istediğimiz içeriği girebiliriz.Diğer bölüm Panelimizin tetikleyicilerini belirlediğimiz bölüm. Bu bölümde <Triggers>Tetikleyiciler</Triggers> etiketleri ile sınırlanır. Eğer tetileyicimiz Panelimizin içerisinde iste <Triggers> bölümün belirlememize gerek yoktur, fakat tetikleyicimiz panelimizin dışında ise bu bölümde tanımlamamız gerekir. Şimdi bunları birer örnek ile açıklayalım. |
| |
Örnek 1: Tetikleyici Panelin İçerisinde ise |
| |
Deneme.aspx
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp: asp:TextBox ID="Text1" runat="server" Text=" " /><br />
<asp:Label ID="Label1" runat="server" Text=""></asp:Label>
<asp:Button ID="Button1" runat="server" Text="Button" />
</ContentTemplate>
</asp:UpdatePanel>
Deneme.aspx.cs
protected void Button1_Click(object sender, EventArgs e)
{
Label1.Text = Text1.Text;
} |
|
| |
Örnek 2: Tetikleyici Panelin Dışında ise |
| |
Deneme.aspx
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp: asp:TextBox ID="Text1" runat="server" Text=" " /><br />
<asp:Label ID="Label1" runat="server" Text=""></asp:Label>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID=" Button1" EventName="Click" />
</Triggers>
</asp:UpdatePanel>
<asp:Button ID="Button1" runat="server" Text="Button" />
Deneme.aspx.cs
protected void Button1_Click(object sender, EventArgs e)
{
Label1.Text = Text1.Text;
} |
|
| |
Örnek 3: İki tetikleyicili sistem (birisi panelin içinde diğeri dışında) |
| |
Deneme.aspx
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp: asp:TextBox ID="Text1" runat="server" Text=" " /><br />
<asp:Label ID="Label1" runat="server" Text=""></asp:Label>
<asp:Button ID="Button2" runat="server" Text="Button2" />
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID=" Button2" EventName="Click" />
</Triggers>
</asp:UpdatePanel>
<asp:Button ID="Button2" runat="server" Text="Button2" />
Deneme.aspx.cs
protected void Button1_Click(object sender, EventArgs e)
{
Label1.Text = Text1.Text;
}
protected void Button2_Click(object sender, EventArgs e)
{
Label1.Text = "Dışardaki tetikleyiciye basıldı";
} |
|
| |
| Örneklerde de gördüğümüz gibi basit bir şekilde sayfamız bölümler oluşturup atadığımız tetikleyiciler yardımı ile sadece bu bölümleri güncelleyebiliriz, bir paneli birden fazla tetikleyici ile güncelleyebiliriz. Bir sonraki makalede görüşmek üzere. |
| |
| Tahir MUTLU |
| |
| www.tahirmutlu.com www.bilyaz.com |
| |
