[RISOLTO][PHP] Passaggio variabili senza refresh di pagina

Discussione in 'PHP' iniziata da carbonchio, 8 Dicembre 2017.

Tag (etichette):
  1. carbonchio

    carbonchio Nuovo Utente

    Registrato:
    8 Dicembre 2017
    Messaggi:
    6
    Mi Piace Ricevuti:
    0
    Punteggio:
    1
    Sesso:
    Maschio
    Buongiorno a tutti.
    Ho un problema con una pagina php piuttosto banale, dove ho un menu ad albero costruito leggendo delle directory che contengono file html. Poi creo dei link nella forma canonica "pagina.php?p=valore da passare". Al click sul link viene incorporato del codice html nella pagina, e fin qui tutto bene. Però in questo modo ad ogni click si ricarica la pagina e viene ricreato l'albero con spreco di risorse, senza contare che l'albero si richiude ogni volta e non è pratico.
    Ho letto che si possono passare le variabili con uno script ajax senza ricaricare la pagina, ma non ho capito bene come funzioni. Se qualcuno gentilmente me lo potesse spiegare con un piccolo esempio sarebbe molto gradito.
    Sper di aver postato nella giusta sezione...
    Ringrazio anticipatamente
     
  2. macus_adi

    macus_adi Utente Attivo

    Registrato:
    5 Dicembre 2017
    Messaggi:
    858
    Mi Piace Ricevuti:
    43
    Punteggio:
    28
    Sesso:
    Maschio
    Occupazione:
    Developer
    Località:
    L'Aquila
    Dovresti fare una navigazione attraverso il caricamento delle pagine (contenuto) attraverso AJAX in maniera asincrona, in questo modo non vedrai la pagina ricaricarsi ogni volta.
    Spero sia utile
     
  3. carbonchio

    carbonchio Nuovo Utente

    Registrato:
    8 Dicembre 2017
    Messaggi:
    6
    Mi Piace Ricevuti:
    0
    Punteggio:
    1
    Sesso:
    Maschio
    Grazie Macus_adi,
    a livello teorico penso anch'io sia la soluzione, non ho chiara la realizzazione a livello tecnico.
    Ad esempio credo si debba usare la funzione
    PHP:
    $.ajax();
    ma non ho capito come attivarla nel link.
    Per questo chiedevo un piccolo esempio pratico.
     
  4. marino51

    marino51 Utente Attivo

    Registrato:
    28 Febbraio 2013
    Messaggi:
    2.490
    Mi Piace Ricevuti:
    123
    Punteggio:
    63
    Occupazione:
    free lance
    Località:
    Lombardia
    file : esempio_11.html
    HTML:
    <!DOCTYPE html>
        <head>
            <title>jQuery AJAX test</title>
            <script type="text/javascript" src="jquery.min.js"></script>
            <script type="text/javascript">
    $(document).ready(function(){
        $('#myButton').bind("click",function()
        {
            alert( "Handler for .click() called." );
    
            var data =
            {
                foo:  123,
                bar:  456,
                rows:
                [{
                    column1: 'hello',
                    column2: 'hola',
                    column3: 'bonjour',
                },
                {
                    column1: 'goodbye',
                    column2: 'hasta luego',
                    column3: 'au revoir',
                },
                {
                    column1: 'hello',
                    column2: 'hola',
                    column3: 'bonjour',
                },
                {
                    column1: 'goodbye',
                    column2: 'hasta luego',
                    column3: 'au revoir',
                }],
                test1:
                {
                    test2:
                    {
                        test3: 'abcdef'
                    }
                }
            }
    
            alert(data['foo']+' - '+data['test1']['test2']['test3']);
    
            $.ajax
            ({
                type:    'post',
                cache:   false,
                url:     'esempio_11.php',
                data:    data,
                success: function(response) { $('#myDiv').html(response); },
                error:   function()         { $('#myDiv').html("malfunzionamento ajax"); }
            });
        });
    });
            </script>
        </head>
        <body>
            <input id="myButton" type="button" style="width: 130px; height: 60px" value="send AJAX" />
            <br /> <br />
        <div id="myDiv"> </div>
        </body>
    </html>
    file : esempio_11.php
    PHP:
    <?php
    echo "ho ricevuto l'array e restituisco questo testo";
    ?>
    l'esempio è molto semplice,
    la variabile data contiene, in questo caso, un'array, dovrà contenere le informazioni da passare allo script php
    php restituisce una stringa di caratteri che viene visualizzata
    spero sia sufficiente per creare ciò che ti serve

    upload_2017-12-9_11-44-15.png
    upload_2017-12-9_11-45-0.png

    ps, gli alert hanno solo lo scopo di controllo
     
  5. carbonchio

    carbonchio Nuovo Utente

    Registrato:
    8 Dicembre 2017
    Messaggi:
    6
    Mi Piace Ricevuti:
    0
    Punteggio:
    1
    Sesso:
    Maschio
    Grazie mille Marino51,
    appena ho un momento lo provo.
     
  6. carbonchio

    carbonchio Nuovo Utente

    Registrato:
    8 Dicembre 2017
    Messaggi:
    6
    Mi Piace Ricevuti:
    0
    Punteggio:
    1
    Sesso:
    Maschio
    Grazie mille Marino51,

    dal tuo esempio pratico sono riuscito ad ottenere (con qualche difficoltà) il comportamento che cercavo.
    Posto il codice nel caso servisse a qualcun'altro:

    ho un albero di navigazione con link del tipo
    HTML:
    <li><a class="menu" href="data/01-Leopardi 1934-1963/06/06-00.html">La nuova poetica leopardiana</a>
    Codice ajax:
    HTML:
    <script>
       $(document).ready(function(){
           $('a.menu').click(function(e){
               e.preventDefault();
               $page = $(this).attr('href');
               $.ajax({
                   type: "GET",
                   url: "process.php",
                   data: "page=" + $page,
                   cache: false,
                   dataType :'json',
                   success: function(data){
                       $("#dynamic").html(data["content"]);
                       $("title").html(data["title"]);
                   }
               });
           });
       });
    </script>
    
    e nella pagina process.php:
    PHP:

        $content 
    "";
        
    $title "";

        if(isset(
    $_GET['page'])){
                
    $html file_get_contents($_GET['page']);
                
    $dom = new DOMDocument('1.0''UTF-8');
                
    $dom->loadHTML($html);
                
    $element $dom->getElementById("idContainer");
                
    $title $dom->getElementsByTagName("title");
                
    $content $dom->saveHTML($element);
        }
       
        
    $return_arr = ["title" => $title->item(0)->nodeValue,
                       
    "content" => $content];
        echo 
    json_encode($return_arr);
    in pratica al click dell'utente sul link intercetto l'evento e invio una richiesta ajax a process.php inviando l'url della pagina, process.php estrae il title ed il contenuto del div principale ("idContainer") e me li invia come array (json), dopodichè aggiorno la pagina SENZA refresh.
    Grazie a tutti e alla prossima
     
  7. Max 1

    Max 1 Super Moderatore Membro dello Staff SUPER MOD MOD

    Registrato:
    29 Febbraio 2012
    Messaggi:
    3.710
    Mi Piace Ricevuti:
    275
    Punteggio:
    83
    Sesso:
    Maschio
    @Domenico_Falco1
    Apri una discussione tutta tua!
    È sempre meglio sia per te che avrai più risposte e più mirate che per l'autore di questa discussione!!
    Ricorda però che per postare codice PHP non devi usare il tag code.gif ma devi usare il tag php.png
    Grazie
     
  8. Domenico_Falco1

    Domenico_Falco1 Nuovo Utente

    Registrato:
    27 Maggio 2019
    Messaggi:
    26
    Mi Piace Ricevuti:
    0
    Punteggio:
    1
    Sesso:
    Maschio
    Buona sera, d'accordo, provvedo subito e chiedo scusa :)
     
Sto caricando...
Discussioni simili - [RISOLTO][PHP] Passaggio variabili
  1. Crios816
    Risposte:
    8
    Visite:
    384
  2. Kolop
    Risposte:
    2
    Visite:
    227
  3. Coby
    Risposte:
    14
    Visite:
    488
  4. Coby
    Risposte:
    4
    Visite:
    528
  5. Tommy03
    Risposte:
    2
    Visite:
    418

Condividi questa Pagina