Demonstra Passo a passo: Introdução ao controle Timer

Artigo
10/15/2014

Nesta explicação passo a passo você irá atualizar a parte de uma página da Web em um intervalo cronometrado usando os três controles do servidor ASP.NET AJAX: the ScriptManager controle, o UpdatePanel controle e o Timer controle. Adicionar esses controles a uma página elimina a necessidade de atualizar a página inteira com cada postback.Somente o conteúdo do controle UpdatePanel será atualizado.

Para obter mais informações sobre renderização parcial da página, consulte Visão geral de renderização de página parcial.

Pré-requisitos

Para implementar os procedimentos nessa explicação passo a passo, você precisará:

Microsoft Visual Studio 2005 ou Visual Web Developer Express Edition.
Um site da Web ASP.NET habilitado para AJAX.

Para atualizar um controle UpdatePanel em intervalo regular

Em Microsoft Visual Studio 2005 or Visual Web Developer Express Edition, crie uma nova página da Web ASP.NET habilitada para AJAX e alterne para modo de Design.
Se a página ainda não contiver um controle ScriptManager, na guia Extensões de AJAXda caixa de ferramentas, clique duas vezes no controle ScriptManager para adicioná-lo à página.
Na caixa de ferramentas, clique duas vezes no controle UpdatePanel para adicioná-lo à página da Web.

Clique dentro do UpdatePanel controle e, em seguida, clique duas vezes no controle Timer para adicioná-lo ao controle UpdatePanel.

Observação:
O controle Timer pode funcionar como um disparador tanto dentro ou fora de um controle UpdatePanel.Este exemplo mostra como usar o controle Timer dentro de um controle UpdatePanel.Para obter um exemplo de uso de um controle Timer como um disparador fora de um controle UpdatePanel, consulte Demonstra Passo a passo: Usando o controle Timer do ASP.NET com vários controles UpdatePanel.

Defina a propriedade Interval do controle Timer para 10000.

A propriedade Interval é definida em milissegundos, de modo que a propriedade Interval seja configurada como 10.000 milissegundos atualizará o controle UpdatePanel a cada 10 segundos.

Observação:
Nesse exemplo, o intervalo de timer é definido como 10 segundos.Dessa forma, quando você executar o exemplo, não é necessário que você espere um longo tempo para ver os resultados.No entanto, cada intervalo de timer causa um postback para o servidor e causa tráfego de rede.Portanto, em um aplicativo de produção você deve definir o intervalo para o tempo mais longo, o que é ainda prático para o seu aplicativo.

Nesse exemplo, o intervalo de timer é definido como 10 segundos.Dessa forma, quando você executar o exemplo, não é necessário que você espere um longo tempo para ver os resultados.No entanto, cada intervalo de timer causa um postback para o servidor e causa tráfego de rede.Portanto, em um aplicativo de produção você deve definir o intervalo para o tempo mais longo, o que é ainda prático para o seu aplicativo.

Clique dentro do controle UpdatePanel e,em seguida, na guia Standard da caixa de ferramentas, clique duas vezes no controle Label para adicioná-lo ao controle UpdatePanel.

Observação:

Certifique-se de adicionar o controle Label dentro do controle UpdatePanel.
conjunto Text propriedade para o painel não são atualizado ainda.
Clique fora do controle UpdatePanel e clique duas vezes no controle Label para adicionar um segundo rótulo fora do controle UpdatePanel.

Observação:

Certifique-se de adicionar o segundo controle Label dentro do controle UpdatePanel.
Clique duas vezes no controle Timer para criar um manipulador para o evento Tick.
Adicione código que defina a propriedade Text do controle Label1 como a hora atual.
Crie um manipulador Page_Load e adicione código que defina a propriedade Text do controle Label2 como a hora que a página é criada.

Observação:
Certifique-se de adicionar o controle Label dentro do controle UpdatePanel.

Observação:
Certifique-se de adicionar o segundo controle Label dentro do controle UpdatePanel.

Alterne para modo de origem.

Certifique-se que a marcação para a página está semelhante a seguir:

Partial Class _Default
    Inherits System.Web.UI.Page

    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        Label2.Text = "Page created at: " & _
          DateTime.Now.ToLongTimeString()
    End Sub

    Protected Sub Timer1_Tick(ByVal sender As Object, ByVal e As System.EventArgs)
        Label1.Text = "Panel refreshed at: " & _
          DateTime.Now.ToLongTimeString()

    End Sub
End Class

public partial class _Default : System.Web.UI.Page 
{
    protected void Page_Load(object sender, EventArgs e)
    {
        Label2.Text = "Page created at: " +
          DateTime.Now.ToLongTimeString();
    }
    protected void Timer1_Tick(object sender, EventArgs e)
    {
        Label1.Text = "Panel refreshed at: " +
          DateTime.Now.ToLongTimeString();
    }
}

Salve suas alterações e, em seguida, pressione CTRL + F5 para exibir a página em um navegador.
Espere pelo menos 10 segundos para o painel atualizar.

O texto em que as alterações do painel Exibir o último tempo que o painel de conteúdo foi atualizado.No entanto, o texto fora o painel não é atualizado.

Revisão

Essa explicação passo a passo introduziu os conceitos básicos de usar um controle Timer e um controle UpdatePanel para ativar as atualizações parciais da página.Você deve adicionar um controle ScriptManager para qualquer página que contenha um controle UpdatePanel ou um controle Timer.Por padrão, um controle Timer dentro do painel fará com que apenas o painel atualize durante um postback assíncrono.Um controle Timer fora de um painel pode causar o UpdatePanel para ser atualizado se ele estiver configurado como um disparador para o painel.

A próxima etapa é para aprender sobre como usar o controle Timer fora de um controle UpdatePanel e sobre como usar o timer para atualizar mais de um controle UpdatePanel.Para obter informações sobre essas tarefas, consulte Demonstra Passo a passo: Usando o controle Timer do ASP.NET com vários controles UpdatePanel.