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

Olá pessoal, neste artigo veremos os conceitos e exemplos práticos dos controles existentes na aba Ajax Extensions, do ASP.NET 3.5. Acompanhem:

Os Ajax Extensions contém um conjunto de controles simples, que executam chamadas assíncronas através de controles visuais. 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. Veja um artigo descrevendo o UpdatePanel, clicando aqui.


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

</asp:UpdatePanel>

 UpdateProgress – 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 mais usado por você do Ajax Extensions.

Disponibilizo o código-fonte desta aplicação clicando aqui.

Assim finalizo o artigo. Muito obrigado a todos!

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

 Wellington Balbo de Camargo

wellingtonbalbo@gmail.com

About these ads

Publicado em 03/07/2011, em .NET, ASP.NET, C# e marcado como , , , , , . Adicione o link aos favoritos. Deixe um comentário.

Deixe uma resposta

Preencha os seus dados abaixo ou clique em um ícone para log in:

Logotipo do WordPress.com

Você está comentando utilizando sua conta WordPress.com. Sair / Alterar )

Imagem do Twitter

Você está comentando utilizando sua conta Twitter. Sair / Alterar )

Foto do Facebook

Você está comentando utilizando sua conta Facebook. Sair / Alterar )

Foto do Google+

Você está comentando utilizando sua conta Google+. Sair / Alterar )

Conectando a %s

Seguir

Obtenha todo post novo entregue na sua caixa de entrada.

Junte-se a 934 outros seguidores

%d blogueiros gostam disto: