DOMANDA Risultato query mysql/php senza aggiornare pagina

Pubblicità
espanico

espanico

Utente Attivo
Messaggi
145
Reazioni
11
Punteggio
49
Salve, ho realizzato uno script dove vado a inserire, tramite un form html dei dati in un database mysql, tramite php. Fin qui tutto ok, ora vorrei che nella stessa pagina dove inserisco i dati, quindi dove risiede il form html, sotto vengono elencati i dati appena inseriti senza dover aggiornare la pagina, tipo come accade twitter,facebook etc.
Al momento riesco a inviare i dati senza abbandonare la pagina ma non a visualizzare i nuovi dati. Ecco un esempio

Index.php
PHP: 
//FORM 
<form name="modulo"> 
    <p>Nome</p> 
    <p><input type="text" name="nome" id="nome"> 
    <p>Cognome</p> 
     <input type="text" name="cognome" id="cognome"> 
    <input type="button" id="bottone" value="Invia i dati"> 
</form> 

<div id="risultato"></div> 




// SCRIPT AJAX 

<script type="text/javascript"> 
$(document).ready(function() { 

  //al click sul bottone del form 
  $("#bottone").click(function(){ 

    //associo variabili 
    var nome = $("#nome").val(); 
    var cognome = $("#cognome").val(); 

  //chiamata ajax 
    $.ajax({ 

     //imposto il tipo di invio dati  
      type: "POST", 

      //Invio i dati alla pagina php 
      url: "salva.php", 

      //Dati da salvare 
      data: "nome=" + nome + "&cognome=" + cognome, 
      dataType: "html", 

      //visualizzazione errori/ok 
      success: function(msg) 
      { 
        $("#risultato").html(msg);  
      }, 
      error: function() 
      { 
        alert("Chiamata fallita, si prega di riprovare...");  
      } 
    }); 
  }); 
}); 
</script>

salva.php
PHP: 
<?php  
include("connessione_db.php"); 
include("config.php"); 
mysql_select_db("$db_name",$connessione); //seleziono il database e mi connetto  

$nome = $_POST['nome']; 
$cognome = $_POST['cognome'];  

$sql = "INSERT INTO tabella SET  
nome = '$nome', cognome = '$cognome', 
 if (@mysql_query($sql)) { echo '<p>Dati salvati correttamente</p>'; }  
else { echo '<p>Si e verificato un errore ' . mysql_error() .'</p>'; } 
?>
 
Ciao, il tutorial del tuo link fa gia quello che io so fare, e ho postato sopra. Il problema e visualizzare sotto a quel form i dati appena inviati, tipo come accade con i commenti dei blog o dei forum. Tipo io ho due campi nome - commento, appena una persona inserisce le informazioni e preme invio questi dati si devono subito vedere sotto senza aggiornare la pagina.
 
Per visualizzare i dati appena inseriti puoi usare lo stesso metodo che usi per gli errori, ovvero

$('#risultato').html('<p>Nome: '+nome+' - Cognome: '+cognome+'</p>');
 
cawletto ha detto:
Pardon, non avevo letto bene. Allora mi correggo, stavolta dovrebbe (:look:) servirti questo: Selezione Dinamica da Database con AJAX e PHP

Con l'articolo che ti ho dato prima (o il tuo metodo) inserisci le informazioni nel database e con questo estrai le informazioni dal database stampandole nella pagina! :)
Clicca per espandere...
Grazie per i link, anche se non fanno propriamente quello che io intendevo, comunque mi sono utili, e un altro argomento che cercavo ;)
Juggernaut ha detto:
Per visualizzare i dati appena inseriti puoi usare lo stesso metodo che usi per gli errori, ovvero

$('#risultato').html('<p>Nome: '+nome+' - Cognome: '+cognome+'</p>');
Clicca per espandere...

In questo modo visualizzo solo i dati appena inserito o anche i vecchi già presenti nel db? Io ho fatto una prova ma non so se e il metodo giusto, qui potete vedere l'esempio online. Link

In pratica metto estraggo i dati sia nella pagina salva.php e sia nella index.php in modo che se una persona visita per la prima volta gia visualizza i vecchi dati. Mentre se ne aggiunge altri li visualizza subito senza dover aggiornare la pagina. Diciamo che il risultato finale mi soddisfa, ma vorrei sapere se e un modo professionale.

Grazie.
 
Io sono con Cawletto, attraverso una richiesta con AJAX/PHP puoi gestire in tempo reale, senza il refresh della pagina e con effetti grafici dinamici il tuo database. Anche il metodo di Juggernaut è funzionante ma macchinoso e poco amalgamabile a futuri aggiornamenti (p.e. è una rottura se successivamente vuoi aggiungere accanto ad ogni coppia nome/cognome una combobox per l'eliminazione di quel record).

EDIT: Chiedo scusa avevo letto male cosa diceva Juggernaut :muro: la scelta migliore è fare un misto: ad ogni "submit", in caso di success, (sto parlando del metodo ajax/php) fai la funzione $.html(), magari con un ciclo for per ogni coppia nome/cognome cosi strutturato:
Codice: 
[COLOR=#333333]per ogni utente {    
    var tempHtml = [/COLOR][COLOR=#333333]$('#risultato').html();
[/COLOR][COLOR=#333333]    tempHtml += [/COLOR][COLOR=#333333]'<p>Nome: '+nome+' - Cognome: '+cognome+'</p>';[/COLOR][COLOR=#333333]
    $('#risultato').html(tempHtml);
}
[/COLOR]
 
Ultima modifica:
Devi creare un altra funzione del jquery che si occupi di interrogare il server PHP ogni tot tempo. Il server si occupa soltanto di rispondere con il contenuto del database.

Per evitare sprechi, puoi inserire una variabile da passare al PHP che identifica il numero dell'ultima riga ovvero:

1) L'utente apre la pagina, i JS effettua la richiesta al PHP con ULTIMA_RIGA_RICEVUTA = 0, che risponde con l'intero contenuto della tabella
2) Dopo tot tempo il JS effettua di nuova la richiesta per avere aggiornamenti, inviando come dato al database l'ULTIMA_RIGA_RICEVUTA che contiene l'id dell'ultima riga ricevuta al passo 1.
 
per chiamate del genere io uso sempre la funzione load per postare i dati via jQuery (che è una scorciatoia alla chiamata ajax). Supponendo che salva.php sia nella root, per fare quello che ti serve ti basta usare il codice

PHP: 
$(document).ready(function() {
 $("#bottone").click(function() {
  $("#risultato").load("/salva.php", {
    "nome"   :  $("#nome").val(),
    "cognome"  :  $("#cognome").val()
  });
 });
});
 
Pubblicità
Pubblicità
Indietro
Top