Aggiornare elemento DOM

[Marco_88]

Ciao a tutti come da titolo dovrei aggiornare periodicamente una una classe css senza ricaricare tutta la pagina.
Ho provato in questa maniera ma sinceramente non mi è chiaro come interagisce JQuery con il DOM poiché a quanto pare lo script qui sotto non sembra funzionare.
Qualcuno mi può aiutare a capire meglio?
Grazie

<div class="base mt10 refresh">
.....contenuto......
</div>

<script src="https://code.jquery.com/jquery-2.1.1.min.js" type="text/javascript"></script>
		
        <script>
        $(document).ready(function(){
        setInterval(function(){
        $(".refresh").load('.refresh')
        }, 2000);
        });
        </script>

 

[Akuma]

Allora devi indicare dove effettuare la ricerca per caricare il contenuto.

$(".refresh").load("Pagina.html .refresh");

In questo caso è come se dicessi a jquery di caricare il contenuto di .refresh che si trova all'interno della pagina indicata, e di stamparlo nel div .refresh.

Inviato dal mio GT-I9300 Archidroid2

 

[Marco_88]

Ciao akuma, il fatto è che, come ho scoperto poi, oltre a caricare la pagina che è in.php devo trovare un modo per includere nel caricamento anche le classi necessarie per farla funzionare.
Infatti al caricamento della classe .refresh non avviene il popolamento degli elementi contenuti in essa poiché sono degli output in php.
La classe refresh di fatto rimane vuota.

<script>
		
		$(document).ready(function(){
			setInterval(function(){
			$(".refresh").load('pages/product.php .refresh')
			}, 2000);
			
			});

 </script>

 

[Marco_88]

Bah sono fermo così.

<script>
 
$(document).ready(function(){
    setInterval(function(){
       $.ajax({
          type: "POST",
          url: "pages/product.php",
          data: $(".refresh"),
          success: function(data) {
               $(this).load(data);    
          },
          error: function() {
            alert("chiamata non riuscita"); 
          }
          
         });
    }, 25000);
});
 
</script>

 

[n1k4r0]

scusa Marco_88 ma ho il dubbio di non aver capito affatto quello che chiedi. vorresti modificare il contenuto di una classe css dinamicamente senza ricaricare la pagina? oppure vuoi aggiornare il contenuto di un elemento della pagina senza ricaricarla tutta?

a parte questo non ho capito alcune parti del codice

data: $(".refresh")

data nella chiamata ajax di jquery serve per mandare alla pagina variabili e valori, ad esempio

data: 'a=1&b=2'

variabili che poi la pagina php utilizzerà per i suoi script, tu invece passi un elemento della pagina e non capisco il perché.

$(this).load(data)

quel $(this) inserito dentro al success di una chiamata ajax non fa riferimento a nulla, dovresti mettere qualcosa tipo $('.refresh') perché ci sia un elemento al quale riferirsi.
il comando load serve per eseguire una funzione una volta caricato il contenuto di un elemento, di solito si usa con window

$( window ).load(function() {
  // codice
});

per eseguire i comandi una volta caricata completamente la pagina grafica compresa, non capisco cosa vorresti che facesse nel tuo caso visto che la pagina è già completamente caricata da un po' quando questo script parte.

mi spiace ma, probabilmente per colpa mia, non capisco proprio cosa vorresti ottenere. riusciresti a spiegare meglio cosa vuoi fare?

 

[Marco_88]

ciao Ni4r0, questo codice che ho scritto è totalmente sbagliato, e se non si capisce è colpa mia perché sto ancora studiando per capire bene jquery e ajax e alcuni concetti che ho espresso nel codice sopra sono stati abbastanza approssimativi, tutto ciò per tentare di risolvere il problema che ho.

Comunque cerco di spiegarmi nella maniera più sintetica possibile: devo fare il refresh di una classe (o di tutta la pagina non è rilevante) periodicamente su una pagina in php. Non aggiungo altro cosi non faccio confusione

Grazie

 

[n1k4r0]

marco è proprio questo che non capisco, cosa intendi per una classe? una classe di css?

 

[Marco_88]

abbandoniamo l'idea di una classe css, facciamo semplicemente un div per esempio #refresh.

 

[n1k4r0]

allora per aggiornare il contenuto di un div ci siamo quasi col tuo codice, bastano alcune piccole modifiche

$(document).ready(function(){
    setInterval(function(){
       $.ajax({
          type: "POST",
          url: "pages/product.php",
          success: function(data) {
               $('#refresh').html(data);    
          },
          error: function() {
            alert("chiamata non riuscita"); 
          }
          
         });
    }, 25000);
});

messo così dovrebbe andare a meno che la pagina product.php non abbia bisogno di parametri nel qual caso dopo la riga url: "pages/product.php", devi aggiungere data

// esempio
data: 'a=1&b=2',

se invece non ha bisogno di variabili allora dovrebbe funzionare.

 

[Marco_88]

n1k4r0, non dovrebbe avere bisogno di variabili, nel senso che quello che mi aspetto da questo script è che ricarichi il contenuto del div con quello è successo sul server nel frattempo (il div#refresh contiene codice php dove conteggia il numero di offerte inserite su un'asta online e gli utenti devono poter vedere l'ultima offerta inserita per svolgere i rilanci nel più breve tempo possibile, senza appunto ricaricare la pagina).
L' unica cosa è che ora non posso provarlo perché ho l' FTP impegnato. Appena lo testo ti faccio sapere se funziona.