Collegamento metodo$.ajax con file php

VAik

Utente Attivo
16 Apr 2016
117
3
18
Ciao a tutti
oggi ho provato ad eseguire un collegamento semplice tra una pagina html con javascript ed un file .php.
Vorrei mostrare nella mia pagina html, dopo aver premuto un bottone, il timestamp che si ottiene nella mia pagina "prova_JSON2.php" . Ma anche senza errori non riesco a farlo funzionare.

Cosa devo modificare?


HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>


<script src="../css/lib/jquery-latest.js"></script>
<script src="../css/lib/jquery.effects.core.js"></script>
<style>
        #result{
            width: 250px;
            height: 100px;
            border: 1px solid gray;
        }

     .loading{   /*nascondo immagine gif*/
            display: none;
        }
</style>


<script type="text/javascript">
        $(document).ready(function() {
/*Nell’elemento #input_form, al verificarsi dell’evento submit,
 esegui la seguente funzione*/
            $("#input_form").submit(function(){
               
                 $(".button").attr("disabled", "disabled");
                 $(".loading").show();

                    /*Ora al verificarsi dell’evento submit
                    disabilitiamo il bottone e mostriamo l’immagine gif:*/
               
               $.ajax({  //fai richiesta ajax al file
               url: 'prova_JSON2.php',
               dataType: "json",
               success: function(data) {
                   $("#timestamp").html(data.timestamp);
                   $("#ora").html(data.ora);
                   $("#giorno").html(data.giorno);
                   $(".button").removeAttr("disabled"); //tolgo attributo
                    $(".loading").hide(); //nascondo gif

                   }
               });
            return false;
            });
  });
</head>
<body>
<form id="input_form" action="?">
        <input type="submit" value="richiedi dati">
       <img src="../images/spinner.gif" border="0" class="loading">

</form>

<div id="result">
   
  Il timestamp attuale è: <span id="timestamp"></span><br />
    Che corrisponde alle ore: <span id="ora"></span><br />
    Del giorno: <span id="giorno"></span>
</div>



</body>
</html>
invece il file "prova_JSON2.php"


PHP:
<?php

/*sleep(2);  posso aggiungere questa istruzione
per far sospendere per due secondi la risposta dal server*/



$time = time();
$ora = date("H:i:s");
$giorno = date("j/n/Y");
echo "{'timestamp':'$time','ora':'$ora','giorno':'$giorno'}";

/*Preleviamo il timestamp, l’ora e la data ed in seguito eseguiamo
 *  l’output a video nel formato Json (nome:valore).*/

?>
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
Ciao, usa json_encode(), prova cosi
PHP:
$time = time();
$ora = date("H:i:s");
$giorno = date("j/n/Y");

$response = array(
    "timestamp" => $time,
    "ora" => $ora,
    "giorno" => $giorno
);
echo json_encode($response);
 
  • Like
Reactions: otto9due and VAik

VAik

Utente Attivo
16 Apr 2016
117
3
18
Funziona, grazie mille

Ho alcune domande:

1) perchè l'array lo scrivi così? e non
PHP:
$response = array[
        "timestamp":$time,
        "ora":$ora,
        "giorno":$giorno
];
che però crea anche qualche problema a livello di sintassi.
E' sbagliato a scriverlo così, punto e basta?

2)come ci si regola quando si deve comunicare con dati json?
costruisco sempre un array e poi utilizzo sempre json_encode() per fornire i dati in risposta ai metodi come $.ajax?
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
la sintassi corretta dell'array in php è come te l'ho postata io. Quello che mi hai scritto adesso è un incrocio tra un json e un array. Qui trovi un esempio di json che è molto più simile a quello che hai postato all'inizio. Quando lavoro con php e json utilizzo sempre la funzione json_encode(), posso passare un array multidimensionale aluucinante e mi restitiusce sempre un json perfetto.
 

VAik

Utente Attivo
16 Apr 2016
117
3
18
Grazie Criric della risposta.
quando vedo la parola array mi parte subito la [].

La forma dell'array allora può essere sia come quella mia (primo post) sia quella che mi hai fatto vedere. giusto?

altra cosa:
quando ragiono con dati JSON, nel file .php, devo inserire tutti i dati che mi servono in un array ed utilizzare json_encode per rimandarli alla pagina chiamante.

infatti nella funzione di success del metodo $.ajax
Codice:
success: function(data) {
$("#timestamp").html(data.timestamp);
                  $("#ora").html(data.ora);
                   $("#giorno").html(data.giorno);
utilizzo appunto data.ora, oppure data.giorno

accedendo così ai vari elementi dell'array.

giusto anche qui?
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
il primo che hai scritto è un json scritto male, se scrivevi cosi
PHP:
echo '{"timestamp":' . $time . ',"ora":"' . $ora . '","giorno":"' . $giorno . '"}';
funzionava comunque. La funzione json_encode ti aiuta a creare json complessi e corretti.
Il resto è corretto.
 
  • Like
Reactions: VAik

VAik

Utente Attivo
16 Apr 2016
117
3
18
Nella pratica avere come risposta ad un metodo $.ajax, dati html, o json da cosa dipende?
da come sono stati creati le varie pagine (.php , .html etc etc) coinvolte del sito?
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
dipenda da come vuoi utilizzare i dati ricevuti, se li devi usare per altre chiamate o per aggiornare degli elementi della pagina chiamante ti conviene utilizzare il json in alternativa puoi semplicemente stampare l'html con $("#contenitore").html(data); cambiando il dataType:
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
più o meno si. Devi fare pratica e ti accorgerai da solo delle piccole differenz.