ricerca a tendine, senza ricaricare la pagina

[bejelit]

ho bisogno di fare un ricerca con menù a tendina:

praticamente io scelgo la provincia, una volta scelta la provincia mi deve cercare sul database tutte le località in quella provincia e quindi aprirmi un'altro menù a tendina con le località.


il tutto è abbastanza semplice, il problema è che lo voglio fare senza dover ricariche la pagina per passare le variabili.

come posso fare?

[}gu|do[z]{®©]

Ajax

[bejelit]

?

[}gu|do[z]{®©]

Originariamente inviato da bejelit
?

Ajax è l'unica cosa che ti permette di afre quello che vuoi.. a meno di non pensare di precaricare tutto in array JS.

Ajax usa javascript (un suo oggetto in particolare) per poter inviare richieste asincrone.
E' l'unico modo con cui puoi aggiornare dei dati in una pagina (sempre a meno di onn precaricarli)

[bejelit]

ho capito, vedo di approfondire.
grazie.

[bejelit]

se qualcuno intanto ha un esempio sottomano potrebbe postare il codice?

[bejelit]

ho scartato completamente la possibilità di fare il menù gerarchico in js, non avrebbe senso precaricare tutto con un db bello grosso.

ho deciso di provare ajax purtroppo non l'ho mai usato, ho letto diverse cose, se ho capito bene potrei fare una cosa del genere:

seleziono una voce da menù, faccio la richiesta ad un altro file che mi eseguirà la query rimandandomi i risultati che utilizzerò per creare il secondo menù.
tutto questo chiaramente senza ricaricare la pagina.

a questo punto avrei bisogno di un piccolo esempio per iniziare a fare quello che ho appena descritto.

[angelclawxx]

servirebbe anche a me una spiegazione :|

[frinkia]

Lato PHP:

supponiamo che tu debba fare un sottomenu a 3 livelli, il classico regione -> provincia -> citta'

La select regione te la fai a mano. Poi devi fare script separati, uno che ti genera o la select completa della provincia oppure l'elenco delle provincie, e l'altro per le citta': tipicamente saranno qualcosa del tipo:

province.php?regione=nomeregione

e

comuni.php?provincia=nomeprovincia

Ripeto: questi due devono restituire solo il componente SELECT oppure l'elenco in qualche formato tuo (es: citta1|citta2|citta3).

Il resto e' da fare via Javascript attraverso la manipolazione del DOM e l'oggetto XMLHttpRequest. Non e' di pertinenza di questo forum ma essenzialmente devi fare qualcosa del genere

<select name="regione" id="regione" onchange="updateProvince()">
 <option>..</option>
</select>

<select name=province" id="province" onchange="updateCitta()">
 <option>..</option>
</select>

<select name="citta" id="citta">
 <option>..</option>
</select>

A questo punto dovrai farti due funzioni updateProvince() e updateCitta() che rispettivamente chiamano via XMLHttpRequest le pagine province.php e citta.php.

La struttura sara' qualcosa del genere:

function updateProvince() {
    // crea oggetto xmlhttp
    var regione = document.getElementById('regione');
    // imposta url a "province.php?regione=" + regione.value;
    // imposta funzione di callback alla funzione sotto
    // invia richiesta
}

funzione funzioneDiCallback(response) {
     var provinceSelect = document.getElementById('province');
     // parsing della risposta in base al formato che hai deciso
     // aggiornamento della select.
}

La parte javascript non e' banalissima e richiede una certa conoscenza dell'XMLHttpRequest. Ti consiglio di chiedere sul forum di Javascript.