Condividi tramite


Procedura dettagliata: introduzione al controllo Timer

Aggiornamento: novembre 2007

In questa procedura dettagliata si aggiornerà parte di una pagina Web dopo un intervallo di tempo utilizzando tre controlli server ASP.NET AJAX: il controllo ScriptManager, il controllo UpdatePanel e il controllo Timer. L'aggiunta di questi controlli a una pagina elimina la necessità di aggiornare l'intera pagina a ogni postback. Verrà aggiornato solo il contenuto del controllo UpdatePanel.

Per ulteriori informazioni sul rendering parziale di una pagina, vedere Cenni preliminari sul rendering a pagina parziale.

Prerequisiti

Per implementare le procedure in questa procedura dettagliata è necessario:

  • Microsoft Visual Studio 2005 o Visual Web Developer Express Edition.

  • Un sito Web ASP.NET con supporto AJAX.

Per aggiornare un controllo UpdatePanel dopo un determinato intervallo

  1. In Microsoft Visual Studio 2005 o Visual Web Developer Express Edition creare una nuova pagina Web ASP.NET con supporto AJAX e passare alla visualizzazione Progettazione.

  2. Se la pagina non contiene ancora un controllo ScriptManager, fare doppio clic sul controllo ScriptManager nella scheda Estensioni AJAX della casella degli strumenti per aggiungerlo alla pagina.

  3. Fare doppio clic sul controllo UpdatePanel nella casella degli strumenti per aggiungerlo alla pagina.

  4. Fare clic all'interno del controllo UpdatePanel, quindi fare doppio clic sul controllo Timer per aggiungerlo al controllo UpdatePanel.

    Nota:

    Il controllo Timer può funzionare come un trigger all’interno o all’esterno di un controllo UpdatePanel. In questo esempio viene mostrato come utilizzare il controllo Timer all'interno di un controllo UpdatePanel. Per un esempio su come utilizzare un controllo Timer come trigger all'esterno di un controllo UpdatePanel, vedere Procedura dettagliata: utilizzo del controllo Timer ASP.NET con più controlli UpdatePanel.

  5. Impostare la proprietà Interval del controllo Timer su 10000.

    La proprietà Interval è definita in millisecondi, pertanto, impostando la proprietà Interval su 10.000 millisecondi, il controllo UpdatePanel viene aggiornato ogni 10 secondi.

    Nota:

    In questo esempio, l'intervallo del timer è impostato su 10 secondi. Quando si esegue l'esempio, non è quindi necessario molto tempo per vedere i risultati. Tuttavia, ogni intervallo del timer provoca un postback al server, con conseguente aumento del traffico di rete. In un'applicazione di produzione è pertanto consigliabile impostare l'intervallo più lungo possibile utile per l'applicazione.

  6. Fare clic all'interno del controllo UpdatePanel, quindi nella scheda Standard della casella degli strumenti fare doppio clic sul controllo Label per aggiungerlo al controllo UpdatePanel.

    Nota:

    Accertarsi di aggiungere il controllo Label all'interno del controllo UpdatePanel.

  7. Impostare la proprietà Text dell'etichetta su Pannello non ancora aggiornato.

  8. Fare clic all'esterno del controllo UpdatePanel, quindi fare doppio clic sul controllo Label per aggiungere una seconda etichetta all'esterno del controllo UpdatePanel.

    Nota:

    Accertarsi di aggiungere il secondo controllo Label all'esterno del controllo UpdatePanel.

  9. Fare doppio clic sul controllo Timer per creare un gestore per l'evento Tick.

  10. Aggiungere codice per impostare la proprietà Text del controllo Label1 sull'ora corrente.

  11. Creare un gestore Page_Load e aggiungere codice per impostare la proprietà Text del controllo Label2 sull'ora di creazione della pagina.

  12. Passare alla visualizzazione Origine.

    Verificare che il markup della pagina assomigli agli elementi seguenti:

    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();
        }
    }
    
  13. Salvare le modifiche e premere CTRL+F5 per visualizzare la pagina in un browser.

  14. Attendere almeno 10 secondi l'aggiornamento del pannello.

    Il testo all'interno del pannello cambia per visualizzare l'ultimo aggiornamento del contenuto del pannello. Il testo al di fuori del pannello non viene invece aggiornato.

Verifica

In questa procedura dettagliata sono stati introdotti i concetti di base dell'utilizzo di un controllo Timer e di un controllo UpdatePanel per consentire aggiornamenti parziali di una pagina. È necessario aggiungere un controllo ScriptManager a ogni pagina contenente un controllo UpdatePanel o Timer. Per impostazione predefinita, un controllo Timer all'interno del pannello provoca esclusivamente l'aggiornamento del pannello durante un postback asincrono. Un controllo Timer all'esterno del panello può provocare l'aggiornamento del controllo UpdatePanel se è configurato come trigger per il pannello.

Il passaggio successivo prevede l'approfondimento dell'utilizzo del controllo Timer all'esterno di un controllo UpdatePanel e dell'utilizzo del timer per aggiornare più controlli UpdatePanel. Per informazioni su queste attività, vedere Procedura dettagliata: utilizzo del controllo Timer ASP.NET con più controlli UpdatePanel.

Vedere anche

Concetti

Cenni preliminari sul controllo Timer

Cenni preliminari sul rendering a pagina parziale

Riferimenti

Timer

UpdatePanel

ScriptManager