Ajax Extensions bölümü, Visual Studio 2005'ten itibaren Web projesi oluşturulurken ToolBox (Araç Çubuğu)'da yer almaktadır.

İçerisinde 5 adet kontrol bulundurmaktadır.

• ScriptManager (Betik Yönerge Yöneticisi)

ScriptManager kontrolü, mevcut AJAX kontrollerini kullanırken mutlaka olması gereken bir kontroldür. Bu kontrolün amacı mevcut klasik Java Script (Java Betik) dosyasını sayfaya dahil etmektir. Böylece AJAX kontrolleri kullanılabilmektedir.

<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>

• ScriptManagerProxy (Betik Yönerge Yöneticisi Vekili)

ScriptManagerProxy kontrolü, istenilirse sadece belirli bir kod bloğunun AJAX ile çalışması için gerekli AJAX öğelerini çağırabilmektedir. Normal ScriptManager’da tamamı doğrudan çağırılırken, ScriptManagerProxy ile sadece belirli bir öğe için çağrılabilmektedir. ScriptManagerProxy kontrolü kullanıldığı zaman ScriptManager kontrolü tarafından tanımlanmış betik ve servis öğeleri eklenebilmektedir. Eğer her sayfanın belirli betik ve servisleri içermesi istenmiyorsa, ScriptManager'dan bu özellikler silinebilmekte ve daha sonra her bir sayfada ScriptManager kontrolü kullanılarak, <Services> ve <Scripts> etiketleri ile istenilen öğeler eklenebilmektedir. Örneğin sayfalardan sadece birinde ya da birkaçında Web servisi eklenmesi gerekmekte ise, o zaman ScriptManagerProxy kullanılmalıdır. Çünkü eğer MasterPage'deki ScriptManager'da bu öğe eklenirse her sayfa için yükleme işlemi gerçekleştirilmektedir ve bu gereksiz bir işlemdir.

<asp:ScriptManagerProxy ID="ScriptManagerProxy1" runat="server">        </asp:ScriptManagerProxy>

• UpdatePanel (Güncelleme Paneli)

UpdatePanel kontrolü, AJAX uygulamalarında, bir Web sayfası içinde HTML kısmında <div> veya <span> etiketi içeren bir alan oluşturarak içerisine eklenen kontrollerin görüntülenmesini ve eşzamansız şekilde güncellenmesini sağlamaktadır. AJAX uygulamalarında, bir sayfa PostBack (Sunucuya Gidip Geri Dönme)işlemine tabi tutulmadan, sadece UpdatePanel içi güncellenebilmektedir. Bu şekilde Web sayfaları daha hızlı çalışmakta ve sunucu ile istemci arasındaki veri trafiği de önemli derecede azalmaktadır. <ContentTemplate>(İçerik Şablonu) ve <Triggers>(Tetikleyici) kısımları olmak üzere iki etiketden oluşmaktadır.

• <ContentTemplate> etiketinde, UpdatePanel içinde yer alacak ASP.NET kontrolleri, HTML kontrolleri, resim dosyaları, metinler gibi içerikler bulunmaktadır. Kısmi güncelleme işleminden sadece bu kısımda yer alan bileşenler etkilenmektedir.
•  <Triggers> etiketinde ise güncelleme işleminin gerçekleşmesini sağlayacak olayların panele bağlanması işlemi gerçekleştirilmektedir. Örneğin birButton(Düğme) kontrolünün Click (Tıklama) olayı veya DropDownList(Açılan Liste) kontrolünün SelectedIndexChanged(Seçili Dizin Değişti) olayının panele bağlanması.

UpdatePanel değişik şekillerde kullanılabilmektedir.

• UpdatePanel İçinde Kontrol Kullanımı : UpdatePanel'i tetikleyecek kontrol UpdatePanel'in içinde olduğu için <Triggers> etiketinde herhangi bir olay eklenmeyebilir. Çünkü UpdatePanel içindeki kontrolün otomatik olarak paneli güncellemesini sağlayan ChildrensAsTrigger (Alt Tetikleyici ) isimli bir özelliği vardır. Bu özellik varsayılan olarak True(Doğru) değeri taşıdığı için UpdatePanel içerisine eklenen bir kontrolün olayı, belirtilmese bile panele tetikleyici olarak eklenmektedir.
  
  Default.aspx sayfası:
  <asp:UpdatePanel ID="UpdatePanel1" runat="server">
      <ContentTemplate>
          <asp:TextBox ID="TextBox1" runat="server">
          </asp:TextBox><br />
          <asp:Button ID="Button1" runat="server" Text="Button" 
                      onclick="Button1_Click" />
      </ContentTemplate>
  </asp:UpdatePanel>
  
  Default.aspx.cs sayfası: 
  protected void Button1_Click(object sender, EventArgs e)
  { 
      TextBox1.Text = DateTime.Now.ToString();
  }
  
  
• UpdatePanel Dışında Kontrol Kullanımı : Kontrol UpdatePanel dışında kullanılırsa güncelleme işlemi otomatik olarak tetiklenememektedir. Kontrol ancak tetikleyici olarak UpdatePanel'e bağlanırsa, kontrol üzerinde gerçekleşecek olay panelin içerisini güncellemektedir. Bu durumda kontrolü UpdatePanel içerisinde bulunan <Triggers> kısmına AsyncPostBackTrigger(Eşzamansız Sunucuya Gidip Gelerek Tetiklenme) olarak eklemek gerekmektedir.
  
  Default.aspx sayfası: 
  <asp:UpdatePanel ID="UpdatePanel1" runat="server"> 
      <ContentTemplate> 
          <table width="1500px" style="background-color: #C0C0C0"> 
                <tr> 
                    <td> 
                        <asp:TextBox ID="TextBox1" runat="server">
                        </asp:TextBox> 
                    </td> 
                </tr> 
          </table> 
      </ContentTemplate> 
      <Triggers> 
          <asp:AsyncPostBackTrigger ControlID="btDış" 
                                    EventName="Click" /> 
      </Triggers> 
  </asp:UpdatePanel><br /><br /> 
  <asp:Button ID="btDıs" runat="server" Text="Panel Dışından Güncelle" 
              OnClick="Button1_Click" />
  
  Default.aspx.cs sayfası:
  protected void Button1_Click(object sender, EventArgs e) 
  { 
      TextBox1.Text = DateTime.Now.ToString(); 
  }
  
  
• Birden Fazla UpdatePanel Kullanımı : Birden fazla UpdatePanel kullanımı bazı karışıklıklara yol açmaktadır. Örneğin, aşağıdaki uygulamada UpdatePanel1 içerisindeki bir kontrol tetiklendiğinde UpdatePanel2 içerisi de güncellenmektedir. UpdatePanel'lerin bu şekilde çalışmalarını sağlayan UpdateMode (Güncelleme Modu) özellikleridir. UpdatePanel'in UpdateMode özelliği varsayılan olarak Always (Her zaman)değerini taşımaktadır. UpdateMode özelliğinin "Always" olması durumunda sayfa içerisindeki herhangi bir UpdatePanel'in tetiklenmesi, panelin de tetiklenmesini sağlamaktadır. Eğer UpdateMode özelliği Conditional (Koşullu) değerindeyse, panel sadece kendi tetikleyicileri aracılığıyla tetiklenmektedir.
  
  Default.aspx sayfası:
  <asp:UpdatePanel ID="UpdatePanel1" runat="server"> 
      <ContentTemplate> 
          <table width="200px" style="background-color: #000080"> 
                 <tr> 
                    <td> 
                       <asp:TextBox ID="TextBox1" runat="server">
                       </asp:TextBox> 
                    </td> 
                 </tr> 
                 <tr> 
                    <td>
                       <asp:Button ID="Button1" runat="server" 
                                   Text="Button1" 
                                   OnClick="Button1_Click" /> 
                    </td> 
                 </tr> 
          </table> 
      </ContentTemplate> 
  </asp:UpdatePanel><br /> 
  <asp:UpdatePanel ID="UpdatePanel2" runat="server"> 
      <ContentTemplate> 
          <table width="200px" style="background-color: #C0C0C0"> 
                 <tr> 
                    <td> 
                       <asp:TextBox ID="TextBox2" runat="server">
                       </asp:TextBox> 
                    </td> 
                 </tr> 
                 <tr> 
                    <td> 
                       <asp:Button ID="Button2" runat="server" 
                                   Text="Button2" 
                                   OnClick="Button1_Click" /> 
                    </td> 
                 </tr> 
          </table> 
      </ContentTemplate> 
  </asp:UpdatePanel>
  
  Default.aspx.cs sayfası:
  protected void Button1_Click(object sender, EventArgs e) 
  { 
       TextBox1.Text = DateTime.Now.ToString(); 
       TextBox2.Text = DateTime.Now.ToString();
  }
  
  Ekran Çıktısı: 1. görüntüde "Button1" ya da "Button2" ye tıklanıldığında saat PostBack olmadan 2. şekildeki gibi güncellenmektedir. Yani her iki UpdatePanel de güncellenmektedir.
    

• UpdateProgress (Güncelleme İlerleyişi)

UpdateProgress, yükleme mesajlarının UpdatePanel ile çalışırken kullanılabilmesi için yapılmış bir kontroldür. <ProgressTemplate>(İlerleme Şablonu)etiketi içindekiler, UpdatePanel güncellenirken Web sayfasında görünecek olan kısımdır. Bu şablona çeşitli kontroller eklenebileceği gibi sadece yazı da eklenebilmektedir.

Default.aspx sayfası:
<asp:UpdatePanel ID="UpdatePanel1" runat="server"> 
    <ContentTemplate> 
         <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
    </ContentTemplate>
    <Triggers> 
         <asp:AsyncPostBackTrigger ControlID="Button1" EventName="Click" />
    </Triggers>
</asp:UpdatePanel> 
<asp:Button ID="Button1" runat="server" 
            Text="Button" OnClick="Button1_Click" />
<asp:UpdateProgress ID="UpdateProgress1" runat="server">
    <ProgressTemplate>
         Yükleniyor Lütfen Bekleyiniz!!!<br /> 
         <img src="images/update_00.gif" />         
    </ProgressTemplate> 
</asp:UpdateProgress>

Default.aspx.cs sayfası:
protected void Button1_Click(object sender, EventArgs e)
{ 
     Thread.Sleep(2000); 
     TextBox1.Text = DateTime.Now.ToString();
}

Ekran Çıktısı:

Yukarıdaki uygulamada <ProgressTemplate> kısmına hem yazı girilmiştir hem de resim eklenmiştir. Düğmeye tıklanıldığında işlem gerçekleştirilirken (PostBack süresi içerisinde) UpdateProgress görüntülenmektedir. UpdateProgress'in görünüm süresini artırmak için Thread (İplik) sınıfının Sleep (Uyut) metodu kullanılmaktadır.

• Timer (Zamanlayıcı)

Timer kontrolü ile veri sürekli etkileşim içerisinde kullanabilmektedir. İsminin Timer verilmesinin nedeni sürekli etkileşimli kontrol mekanizması olmasıdır. Timer, Windows masaüstü uygulamalarında (örneğin bir saat'i ekrana yazdırırken) sürekli aktif tutulması için kullanabilen bir kontroldür. Asp'de ise Web sayfalarında bir sonucun ortaya çıkabilmesi için sayfanın tekrardan yüklenmesi gerekmektedir. AJAX bu sorunu ortadan kaldırır. Timer ile veri belirli zaman aralıklarında sürekli bir şekilde tetiklenebilmektedir.

Default.aspx sayfası:
<asp:Timer ID="Timer1" runat="server" Interval="1000">
</asp:Timer>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
    <Triggers>
        <asp:AsyncPostBackTrigger ControlID="Timer1" />
    </Triggers>
    <ContentTemplate>
        <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
    </ContentTemplate>
</asp:UpdatePanel>

Default.aspx.cs sayfası:
protected void Page_Load(object sender, EventArgs e)
{
    Label1.Text = DateTime.Now.ToString();
}

Ekran çıktısı: Saatin her 1000 milisaniyede bir PostBack olmadan ekrana yazdırılmasını sağlamaktadır.

İlk görüntü:
 
1000 milisaniye sonraki görüntü: