Come aggiornare uno schermo continuamente in ASP.NET Ajax

April 7

Come aggiornare uno schermo continuamente in ASP.NET Ajax


Una volta che si impara a eseguire l'elaborazione asincrona grilletto Ajax, è possibile rendere le pagine web ASP.net più interattivo e utile. Microsoft Visual Studio contiene utili controlli Ajax che permettono pagine Web per aggiornare i propri dati senza comunicare con il server Web. Questo tipo di comunicazione asincrona permette i visitatori del sito di interagire con i controlli che visualizzano i nuovi dati istantaneamente. Creare un orologio digitale, ad esempio, aggiornando un'etichetta ogni secondo. Dopo aver impostato i controlli Ajax, avete solo bisogno di creare un paio di righe di codice per aggiornare gli elementi nelle pagine Web ASP.NET.

istruzione

Creare asincrono trigger

1 Avviare Microsoft Visual Studio, e aprire uno dei tuoi ASP.NET C # progetti web. Individuare form di avvio del progetto in Solution Explorer e fare doppio clic su quella forma per visualizzare il codice HTML markup.

2 Incollare il seguente codice all'interno del tag <form>:

<Asp: ScriptManager ID = "ScriptMgr1" runat = "server" />
<Asp: Timer ID = "Timer1" onTick = runat "Timer1_Tick" = "server" Intervallo = "1000">
<Asp: Timer ID = "Timer1" onTick = runat "Timer1_Tick" = "server" Intervallo = "1000">
</ Asp: Timer>

Questo codice crea la ScriptManager bisogno di parlare. Inoltre, crea un timer il modulo userà per aggiornare i propri dati utilizzando Ajax. Questo timer scatta ogni 1000 millisecondi perché I è il valore dell'attributo Intervallo.

3 Aggiungere il codice riportato di seguito dopo il codice elencato nell'esempio precedente:

<Asp: UpdatePanel runat = "server" ID = "update" UpdateMode = "condizionale">
<ContentTemplate>
<Asp: Label runat = "server" ID = "Label1" />
</ ContentTemplate>

Il tag UpdatePanel crea un pannello di aggiornamento che contiene le parti della pagina Web che si desidera aggiornare in modo asincrono. Il ContentTemplate detiene il contenuto che si desidera apparire nella sezione forme del corpo. In questo esempio, il ContentTemplate contiene un'etichetta il cui ID è "Label1".

4 Inserire il seguente codice sotto il tag di chiusura </ ContentTemplate> mostrato nell'ultimo passaggio:

<Trigger>
<Asp: AsyncPostBackTrigger ControlID = "Timer1" EventName = "Tick" />
</ Trigger>

</ Asp: UpdatePanel>

Il conrol AsynPostBackTrigger rende possibile per un controllo, come ad esempio il timer, per aggiornare un altro controllo quando si verifica un evento di nuovo messaggio asincrono. Ogni volta che il timer scatta, si chiama un metodo che esegue un'azione.

Aggiungere Coding Logic

5 Fare clic sul pulsante "Design" per il modulo in modalità progettazione. Fare clic sul controllo "Timer1" che appare, e premere il tasto "F4" per visualizzare la finestra Proprietà.

6 Fare clic sul pulsante "Eventi" nella parte superiore della finestra, e fare doppio clic l'evento "Tick". Visual Studio apre una finestra di codice e posiziona il cursore all'interno metodo click evento del timer.

7 Incollare il codice riportato di seguito in quel metodo:

Label1.Text = DateTime.Now.ToLongTimeString ();

Questa affermazione modifica il testo dell'etichetta in modo che visualizza l'ora corrente ogni volta che il metodo viene eseguito.

8 Premere il tasto "F5" per eseguire il progetto e visualizzare il modulo nel browser. cambiare il tempo del marchio ogni secondo come il timer fa sì che l'etichetta per aggiornare il suo testo.

Consigli e avvertenze

  • Questo esempio imposta il valore dell'attributo Tick del timer a 1.000 millisecondi. Modificare questo valore per aumentare o diminuire il tempo tra gli aggiornamenti Ajax.
  • Questo esempio aggiorna anche una semplice etichetta, quando si verifica l'evento Tick del timer. Se è necessario aggiornare controlli aggiuntivi, e il codice di farlo in modalità Click del timer.