Conceitos e Exemplo Prático: Controles Nativos do ASP.NET – Ajax Extensions

Confira neste artigo conceitos e exemplos práticos com os controles do Ajax Extensions.

 Os Ajax Extensions contém um conjunto de controles simples, que executam chamadas assíncronas através de controles visuais, usando os conceitos de AJAX. Temos nesta aba cinco controles, que são os seguintes:

 ScriptManager – O ScriptManager é o controle principal desta aba. É ele que habilita as funcionalidades do AJAX na página. Deve existir, obrigatoriamente, apenas um deste controle em cada página.


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

        asp:ScriptManager>

 ScriptManagerProxy – Usado em conjunto com o ScriptManager, este controle é usado em uma página de conteúdo (página que usa uma MasterPage que contenha o ScriptManager).


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

        asp:ScriptManagerProxy>

 Timer – Este controle deve ser usado para executar eventos em determinados intervalos pré-definidos.


<asp:Timer ID="Timer1" runat="server">

        asp:Timer>

 UpdatePanel – Um dos controles mais importantes, o UpdatePanel permite que “pedaços” de uma página sejam atualizados, de forma assíncrona.


<asp:UpdatePanel ID="UpdatePanel1" runat="server">

        asp:UpdatePanel>

 UpdatePanelProgress – Caso a requisição assíncrona demore muito tempo, podemos usar este controle para dar um “feedback” ao usuário exibindo uma mensagem ou imagem animada, enquanto ele aguarda a requisição se completar.


<asp:UpdateProgress ID="UpdateProgress1" runat="server">

        asp:UpdateProgress>

 Agora crie uma aplicação Web, insira um ScriptManager (sempre ele deverá ser usado) na página, arraste o UpdatePanel e os controles Label e Timer para dentro dela. Altere a propriedade Interval do Timer para 1000 (milissegundos, equivalente a 1 segundo). Finalmente dê um duplo clique sobre o Timer e escreva o seguinte código, no evento Tick:

protected void Timer1_Tick(object sender, EventArgs e)

        {

            this.lblData.Text = DateTime.Now.ToString();

        }

 Aperte F5 para compilar e veja o resultado:


Note o código ASPX que o UpdatePanel gerou:

<asp:UpdatePanel ID="UpdatePanel1" runat="server">

            <ContentTemplate>

                <asp:Timer ID="Timer1" runat="server" Interval="1000">

                asp:Timer>

                <br />

                <br />

                <asp:Label ID="lblData" runat="server" Text="Label">asp:Label>

            ContentTemplate>

        asp:UpdatePanel>

 Obs: Sempre os controles devem estar dentro da tag ContentTemplate, do UpdatePanel, para poderem rodar sem problemas.

 Experimente fazer outros testes com o UpdatePanel, que sem dúvida, será o controle do Ajax Extensions mais usado por você.

Irei fazer uma série de artigos somente usando o UpdatePanel, que será abordado com mais ênfase.

 Assim finalizo o artigo. Muito obrigado a todos! 

 Um abraço, e até o próximo artigo.

 Wellington Balbo de Camargo

 wellingtonbalbo@gmail.com

 

Artigos relacionados