Pagina 1 di 2 1 2 ultimoultimo
Visualizzazione dei risultati da 1 a 10 su 11
  1. #1
    Utente di HTML.it
    Registrato dal
    Sep 2004
    Messaggi
    1,344

    Caricamento dati in secondo div senza ricaricare pagina

    Ho 2 div nella pagina. Quello a sx ha un men¨ che richiama in quello di destra una tabella con determinati dati in base alla selezione.

    Al momento al click sul men¨ a sx ricarico la pagina con un dato in get che recupero e con il quale effettuo la lettura del database.

    C'Ŕ la possibilitÓ di ricaricare il contenuto del div di dx senza ricaricare l'intera pagina?

    Una soluzione potrebbe essere un iframe, ma mi piacerebbe poter sfruttare un metodo lato client.

    E' possibile fare ci˛ con ajax? O cosa consigliate?

  2. #2
    Utente di HTML.it L'avatar di m4rko80
    Registrato dal
    Aug 2008
    residenza
    Milano
    Messaggi
    2,651
    Iframe ormao son piuttosto obsoleti ajax e' proprio quel che serve.

    Se vuoi usare jquery jquey ajax sarebbe molto pratico e semplice.

    Gli esempi sono anche nella pagina ma in breve:
    codice:
    $.ajax({
       type: "POST",
       url: "some.php", //script che chiami
       data: "name=John&location=Boston", // parametri da passare
       success: function(msg){ //se la richiesta va a buon fine...
         $('#id_contenitore').html( msg ); //msg e' quello che torna some.php, per esempio echo 'ciao';
       }
     });

  3. #3
    Moderatore di Annunci siti web, Offro lavoro/collaborazione, Cerco lavoro L'avatar di cavicchiandrea
    Registrato dal
    Aug 2001
    Messaggi
    26,101

    Re: Caricamento dati in secondo div senza ricaricare pagina

    Originariamente inviato da aasmdaa
    Ho 2 div nella pagina. Quello a sx ha un men¨ che richiama in quello di destra una tabella con determinati dati in base alla selezione.

    Al momento al click sul men¨ a sx ricarico la pagina con un dato in get che recupero e con il quale effettuo la lettura del database.

    C'Ŕ la possibilitÓ di ricaricare il contenuto del div di dx senza ricaricare l'intera pagina?
    si
    Una soluzione potrebbe essere un iframe, ma mi piacerebbe poter sfruttare un metodo lato client.

    E' possibile fare ci˛ con ajax?
    http://javascript.html.it/guide/
    O cosa consigliate?
    con iframe soluzione pi¨ rapida, ajax un minimo di conoscenza js ci vuole altrimenti ti perdi nei vari passaggi, oppure jquery ti schivi di scrivere il codice ma va studiato e se non hai conoscenza minima di js secondo me si fa pi¨ fatica (ma non tutti sono dello stesso avviso)
    Cavicchi Andrea
    Problemi con javascript, jquery, ajax clicca qui

  4. #4
    Utente di HTML.it
    Registrato dal
    Sep 2004
    Messaggi
    1,344
    Infatti so che frame Ŕ giÓ deprecato ed iframe ormai Ŕ obsoleto.

    Uso giÓ jQuery da tempo ma non ho mai utilizzato ajax, per cui ora mi cimento... preparatevi!!!
    ;-)

    grazie

  5. #5
    Utente di HTML.it
    Registrato dal
    Sep 2004
    Messaggi
    1,344
    GiÓ fatto!

    Di una semplicitÓ disarmante...

    Ora per˛ iniziano le cose pi¨ serie:

    Questa Ŕ la parte jQuery ajax (quella segnalata da m4rko80):

    Codice PHP:
    $.ajax({
        
    type"POST",
        
    url"guide_contenuto.php"//script che chiami
        
    data"id_montaggio=7"// parametri da passare
        
    success: function(msg){ //se la richiesta va a buon fine...
            
    $('#contenuto').htmlmsg ); //msg e' quello che torna some.php, per esempio echo 'ciao';
        
    }
    }); 
    id_montaggio Ŕ un parametro che sfrutto nella query della pagina guide_contenuto.php per caricare i dati e creare la tabella.

    Ora per˛ devo fare in modo di passare id_montaggio in maniera dinamica alla pressione del link presente nel men¨ in un div differente rispetto al conenuto.

    Devo quindi fare una chiamata jQuery onclick sul link che lancia $.ajax?

    La parte finale del men¨ (quella che ora richiama le pagine) Ŕ questa:

    Codice PHP:
    [*][url="guide.php?id_montaggio=<?php echo $row['id_montaggio']; ?>"]<span><?php echo $row['montaggio']; ?></span>[/url]
    che potrebbe innanzitutto diventare

    Codice PHP:
    [*][url="id_montaggio=<?php echo $row['id_montaggio']; ?>"]<span><?php echo $row['montaggio']; ?></span>[/url]
    In modo da sfruttare la parte di href come data da passare nella chiamata ajax.

    Sto andando ad intuizione per cui fermato quando dico castronate...

  6. #6
    Utente di HTML.it
    Registrato dal
    Sep 2004
    Messaggi
    1,344
    E questa la parte javascript:

    Codice PHP:
    $('.vai').click(function(event) {    
        
        
    // previene l'apertura del link
        
    event.preventDefault();
        
        
    // recupera il valore dell'attributo href
        
    var id this.attr('href');
        
        
    // lancia ajax
        
    $.ajax({
            
    type"POST",
            
    url"guide_contenuto.php"//script che chiami
            
    dataid// parametri da passare
            
    success: function(msg){ //se la richiesta va a buon fine...
                
    $('#contenuto').htmlmsg ); //msg e' quello che torna some.php, per esempio echo 'ciao';
            
    }
        });
    }); 
    Peccato non funzioni...

  7. #7
    Utente di HTML.it
    Registrato dal
    Sep 2004
    Messaggi
    1,344
    Penso di aver risolto:

    quello di prima non funzionava perchŔ avevo sbagliato la sintassi sul recupero del valore con jQuery. Ho anche modificato in modo da prendere come riferimento l'id e non l'href nel men¨ cosý non viene visualizzato nella barra del browser.

    Ecco il codice:

    Codice PHP:
    MENU:[*][url="javascript:void(0);"]" class="document vai"><span><?php echo $row['montaggio']; ?></span>[/url]

    JQUERY:
    $('.vai').click(function() {
        var id = $(this).attr("id");
        
        // lancia ajax
        $.ajax({
            type: "POST",
            url: "guide_contenuto.php", //script che chiami
            data: "id_montaggio="+id, // parametri da passare
            success: function(msg){ //se la richiesta va a buon fine...
                $('#contenuto').html( msg ); //msg e' quello che torna some.php, per esempio echo 'ciao';
            }
        });
    });
    Tutto questo funziona, per˛ se ci sono suggerimenti ben vengano.
    grazie.

  8. #8
    Moderatore di Annunci siti web, Offro lavoro/collaborazione, Cerco lavoro L'avatar di cavicchiandrea
    Registrato dal
    Aug 2001
    Messaggi
    26,101
    Se id="<?php echo $row['id_montaggio']; ?>" Ŕ un numero Ŕ sconsigliato antemponi un carattere gli id non devo essere numerici id="1" no id="_1" si
    Cavicchi Andrea
    Problemi con javascript, jquery, ajax clicca qui

  9. #9
    Utente di HTML.it
    Registrato dal
    Sep 2004
    Messaggi
    1,344
    E' proprio numerico. PerchŔ Ŕ sconsigliato?

  10. #10
    Moderatore di Annunci siti web, Offro lavoro/collaborazione, Cerco lavoro L'avatar di cavicchiandrea
    Registrato dal
    Aug 2001
    Messaggi
    26,101
    Originariamente inviato da aasmdaa
    E' proprio numerico. PerchŔ Ŕ sconsigliato?
    Alcuni browser non "riconoscono" i numeri nel tag id e restituiscono nullo meglio non rischiare
    Cavicchi Andrea
    Problemi con javascript, jquery, ajax clicca qui

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2021 vBulletin Solutions, Inc. All rights reserved.