Ajax e select dinamiche

Ciao,

 ho finalmente deciso di imparare qualcosa su ajax e sto facendo vari esperimenti.....adesso ho un porblema....

ho una pagina html in cui ho una select (ho insserito <div> ma non so se e' messo al posto giusto)

<select name="x" id="x" onChange="javascript: getOpt('x');">

    <option value="none">-- Seleziona --</option>

  <div id="x1"></div>

</select>

una pagina php che mi restituisce una stringa del tipo:

<option value="a">a</option><option value="b">b</option> ecc...

e un file ajax.js in cui ho inserito le funzioni che ho trovato nel vostro tutorial ajax in 30 secondi(opportunamente modificate)...

Nella funzione handle faccio:

id=x;

document.getElementById(id).innerHTML = response;

in pratica io vorrei che nella pagina html al posto di <div></div>ci sia la stringa restiutita dal php cioe' voglio ingrandire la select, ma ricevo un errore javascrip in cui mi dice:

document.getElementById(...) null o non e' un oggetto

ho fatto un alert prima di questa riga e id e' corretto.

Se non ho capito male il problema sta o nel div errato o nel getElementById .....

help

grazie mille  :bye:

inviato 10 anni fa
purpitta
X 0 X

Non credo che l'approccio sia corretto. L'esempio dell'articolo su AJAX utilizzava il DIV per individuare una zona della pagina da modificare. La modifica interessava il contenuto del DIV.

Nel tuo caso bisogna modificare gli elementi di una SELECT, quindi usare il DIV è sbagliato. Devi invece usare del codice jacascript per costruire le opzioni della SELECT. Si tratta di usare il modello DOM della pagina html (DHTML). Qui trovi qualche esempio a riguardo:

http://www.webreference.com/programming/java_dhtml/chap8/2/7.html

Pertanto anche lo script PHP deve essere modificato, nel senso che non deve restituire l'HTML che costituisce le opzioni della SELECT bensì le opzioni stesse ed i valori relativi da usare nello script javascript.

 :bye:

risposto 10 anni fa
Gianni Tomasicchio
X 0 X

Ciao,

 ho finalmente deciso di imparare qualcosa su ajax e sto facendo vari esperimenti.....adesso ho un porblema....

ho una pagina html in cui ho una select (ho insserito <div> ma non so se e' messo al posto giusto)

<select name="x" id="x" onChange="javascript: getOpt('x');">

    <option value="none">-- Seleziona --</option>

  <div id="x1"></div>

</select>

una pagina php che mi restituisce una stringa del tipo:

 <option value="a">a</option><option value="b">b</option> ecc...

e un file ajax.js in cui ho inserito le funzioni che ho trovato nel vostro tutorial ajax in 30 secondi(opportunamente modificate)...

Nella funzione handle faccio:

id=x;

document.getElementById(id).innerHTML = response;

in pratica io vorrei che nella pagina html al posto di <div></div>ci sia la stringa restiutita dal php cioe' voglio ingrandire la select, ma ricevo un errore javascrip in cui mi dice:

document.getElementById(...) null o non e' un oggetto

ho fatto un alert prima di questa riga e id e' corretto.

Se non ho capito male il problema sta o nel div errato o nel getElementById .....

help

grazie mille  :bye:

La soluzione di Gianni e' "AJ" non "AJAX"

non ho capito poi che cosa tu voglia fare... cioè alla selezione di un valore cambi la stessa select?

forse ti stavi sconfondendo :P

Normalmente al cambiamento di una drop ne modifichi un'altra

la select sorgente va fatta cosi'

<select name="x2" id="x2" onChange="javascript: getOpt(this);">

    <option value="none">-- Seleziona --</option>

    <option value="1">Opt 1</option>

</select>

la select di destinazione la devi fare cosi'

<div id="x1">

 <select name="x">

    <option value="none">-- Seleziona --</option>

 </select>

</div>

nel js:

function getOpt(arg) {

    var choice = arg.options[arg.selectedIndex].value;

    http.open('get', 'rpc.php?action='azione'&arg='+choice);

    http.onreadystatechange = handleResponse;   

    http.send(null);   

}

nel rpc.php

switch($_REQUEST['action']) {   

     case 'azione':

        switch($_REQUEST['arg']) {

           case '1':

              $x = "x1|<select name=\"x\"><option value=\"a\" >opt a</option>";   

              $x = $x."<option value=\"b\" >opt b</option>";

              $x= x."<option value=\"c\" >opt c</option></select>";

              break;

           case '2':

              $x = "x1|<select name=\"x\"><option value=\"a\" >opt a</option>";   

              $x = $x."<option value=\"b\" >opt b</option>";

              $x= x."<option value=\"c\" >opt c</option></select>";

              break;

        }

        echo $x;

     break;

}

A me una versione simile funziona, ovviamente e' utile se prendi il valore da mysql nel rpc.php... altirmenti la soluzione di gianni era ottimale

risposto 9 anni fa
fiorebat
modificato 9 anni fa
X 0 X
Effettua l'accesso o registrati per rispondere a questa domanda