[Ajax] Reload periodico di un elemento

[Hardcore]

Salve, premesso che sono agli inizi, ho guardato sui due manuali su cui studio e non ho trovato la risposta che cercavo.

Il programma Ajax che ho fatto è qualcosa di semplicissimo,fa una richiesta al file query.php, il quale spara fuori del codice html con una tabella di una

 Select * from tabella

dopo di che inserisco il tutto in un <div id="abc"> </div> tramite l'innerHtml

e funziona tutto perfettamente.

Quello che vorrei fare è un aggiornamento periodico, tipo ogni 20s. Vorrei che se io inserisco dei valori nella tabella, entro 20s questi appaiano anche nella pagina col codice ajax.
Non ho però trovato niente che permetta ciò, e so benissimo che deve esserci qualcosa di simile -.-

[San Vegeta]

ci sono svariati metodi.
Il piu' semplice è avere un iframe (il quale ha un url associato) e tramite javascript fare il reload dell'iframe ogni tot secondi.
Altrimenti dai un id univoco a un contenitore (<div id="container">) e fai una funzione javascript che si collega al tuo script php e mette l'output nel div, sempre ogni tot secondi

qui (http://www.webmaster-talk.com/javasc...t-refresh.html) trovi qualche esempio... comunque basta googlare, è strapieno di esempi già pronti

[Hardcore]

Grazie!!!
Ho provato a cercare ma trovavo solo delle domande, senza le risposte

[San Vegeta]

posta il codice della pagina (o solo il frammento interessato) e appena ho tempo ti scrivo il codice che implementa la funzionalità

[NoeX]

usi qualche framework js in particolare ?

[Hardcore]

nono, è per un esame, devo scrivere tutto in js puro.

alla fine ho semplicemente fatto una cosa di questo genere

function start(){
getAjax(); //Crea l'oggetto XMLHttpRequest
var obj=document.getElementById("div_1");
xmlHttp.open("GET","prova.php?Name=Pippo");
xmlHttp.onreadystatechange= function(){
if(xmlHttp.readyState == 4 && xmlHttp.status==200) {
obj.InnerHtml=xmlHttp.responseText;
}
xmlHttp.send(null);
setTimeout("start()",10000);
}
}

[Amiag]

Quello che hai fatto si chiama polling ed è la soluzione piu semplice al problema.
Da un occhiata qua o metti "comet" su google : http://en.wikipedia.org/wiki/Comet_%28programming%29

ps occhio che da quel che leggo dal codice che hai postato le due righe
xmlHttp.send(null);
setTimeout("start()",10000);
dovrebbero star fuori dalla funzione onreadystatechange non dentro

[Hardcore]

sisi stanno fuori, ho riportato il codice a mente di corsa

[Hardcore]

Continuo invece ad avere il tutto funzionante su Firefox ma non su explorer.

eppure ho

try{
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
}catch (e){
try {
xmlHttp= new ActiveXObject("Microsoft.XMLHTTP");
}catch (e) {}
}

Ma niente con IE non va una sega

[San Vegeta]

metti dei popup ovunque così tracci quale è l'istruzione che non funziona, poi ci aggiorni e vediamo di aiutarti

[NoeX]

Quello che hai fatto si chiama polling ed è la soluzione piu semplice al problema.

Che altra soluzione polling a parte c'è per JS ?
Scemo io che non ho letto il link di Comet ('without the browser explicitly requesting it...')

Però scusa alla fine c'è sempre il client che manda la richiesta al web server...
Il web server non può mica mandare i dati così, senza una richiesta...

quel explicitly è ambiguo

Continuo invece ad avere il tutto funzionante su Firefox ma non su explorer.
eppure ho

try{
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
}catch (e){
try {
xmlHttp= new ActiveXObject("Microsoft.XMLHTTP");
}catch (e) {}
}

Ma niente con IE non va una sega

Provato col debugger JS di IE8 ?

[Tanek]

Qui ho solo il backup molto vecchio del mio progetto e questa settimana sono ancora in ferie quindi non posso controllare (con gioia anche :P ), è IE only però conta che magari l'ho aggiornato e soprattutto questo ricarica una combo, non una pagina (però la questione è ovviamente molto simile):

function createXmlHttpReq(handler)
{
var xmlhttp = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP');
xmlhttp.onreadystatechange = handler;
return xmlhttp;
}

var myRequest = null;

function loadHttp(url)
{
myRequest = createXmlHttpReq(myHandler);
myRequest.open("GET", url);
myRequest.send(null);
}

function myHandler() 
{
if(myRequest != null && myRequest.readyState == 4 && myRequest.status == 200)
document.getElementById('---IdDellaCombo---').innerHTML = myRequest.responseText;
}

edit: aggiungo soprattutto che (sempre con gioia :P ) ho il cervello spento rispetto al lavoro quindi non sono sicuro di niente di quello che ti sto scrivendo, però spero possa aiutarti

[Amiag]

Che altra soluzione polling a parte c'è per JS ?
Scemo io che non ho letto il link di Comet ('without the browser explicitly requesting it...')
Però scusa alla fine c'è sempre il client che manda la richiesta al web server...
Il web server non può mica mandare i dati così, senza una richiesta...

Si e no, ovvero la richiesta iniziale parte sempre dal client, ma quella richiesta puo rimanere aperta e il server continuare a scriverci sopra mano a mano che arrivano nuovi dati. Sugli altri browser si può fare gia da un bel po, su IE serve IE8.

Altrimenti cè anche lo streaming tramite IFrame ma non lho mai usato (è quello che usano credo sia Facebook e Gmail per la chat in tempo reale).

[San Vegeta]

quello non è più polling, è pushing. Essendo l'http stateless, si crea lato server un canale dati sempre aperto (quindi vengono sempre prodotti dati) e lato client un parser dei dati ricevuti. Quando i dati sono sporchi, non fa nulla, quando i dati sono riconosciuti il client fa un'azione. E funziona con tutti i browser.
Però ripeto, è pushing.

[NoeX]

Ok, però in questo modo se fosse un sito grosso ipotizziamo con centinaia di migliaia di client il server ce la fà a gestirli tutti ? O_o Vabbè che in questo caso un pò estremo, poi entrerebbe in gioco anche il clustering

Altro link con tanto di codice

http://www.zeitoun.net/articles/comet_and_php/start