Lavora con noi

ASP.Net

Siti tematici

Lezioni:

...
<
9
10
11
12
Indice

UpdateProgress

Nelle lezioni precedenti abbiamo osservato le potenzializà offerte dal controllo UpdatePanel. L'unica nota negativa che possiamo attribuire a questo controllo è la mancanza di un handler per l'attesa.

Durante l'invio o l'elaborazione asincrona dei dati, infatti, l'utente potrebbe avere la sensazione che l'applicazione non reagisca e replicare richieste o peggio abbandonare la sessione.

Detto fatto ecco il controllo che ne assolve le funzionalità, l'UpdateProgress. Il meccanismo è molto semplice: questo controllo renderizza nella pagina un elemento <div> con del contenuto specifico. Il contenuto è definito in un Template e tipicamente riporta un testo che invita all'attesa, oppure un'animazione che indica l'elaborazione in corso.

La sua visibilità è gesita dall'esecuzione dell'evento asincrono. Non può essere usato per chiamate sincorne nè per il primo caricamento della pagina, senza il PostBack.

Questo controllo può essere incluso nell'UpdatePanel che è chiamato a rappresentare, oppure in un'altra sezione della pagina.

Progesso nell'UpdatePanel

Nel primo caso abbiamo un UpdatePanel che esegue alcune operazioni. In questo caso per simulare l'attesa mettiamo il thread corrente in attesa per 2 secondi. Dopo, verrà reso invisibile il controllo TextBox che riceve l'input dell'utente mostrato in una etichetta.

Listato 1. Struttura della pagina.

<asp:UpdatePanel ID="MyUpdate" runat="server">
<ContentTemplate>
  <asp:TextBox ID="txtRicerca" runat="server" />
  <asp:Label ID="lblRisultato" runat="server" Font-Bold="True" />
  <asp:LinkButton ID="LinkButton1" runat="server" OnClick="LinkButton1_Click">
    Invia
  </asp:LinkButton>

  <asp:UpdateProgress ID="UpdateProgress1" runat="server">
    <ProgressTemplate>
      Attendere, richiesta in corso ...
    </ProgressTemplate>
  </asp:UpdateProgress>

</ContentTemplate>
</asp:UpdatePanel>

Non ci resta che creare la routine per testare il tutto. In questo caso vogliamo verificare semplicemente la sua funzionalità, magari per migliorarne l'estetica, quindi mettiamo semplicemente in attesa il Client per un paio di secondi.

Listato 2. Routine asincrona.

//Routine dichiarata nell' evento OnClick
protected void LinkButton1_Click(object sender, EventArgs e)
{
  //Thread in attesa
  System.Threading.Thread.Sleep(2000);
  txtRicerca.Visible = false;
  lblRisultato.Text = txtRicerca.Text;
}

Nell'esempio abbiamo visto come predisporre il contenuto dell'UpdateProgress (avremmo potuto caricare anche un gif animata...) e come modificare in maniera asincrona il rendering della pagina, senza effettuare PostBack; abbiamo reso invisibile un controllo ed modificato il contenuto di un altro.