Creare all'infinito x righe con select box

[Toniello]

Salve a tutti,
ho visto in rete tool come questi ma non sono riuscito a estrapolare il codice o fare qualche ricerca sull'argomento.

Praticamente l'utente sul sito, schiacciando il pulsante (+) deve creare, in modo continuato per quante volte vuole, una serie di righe gemelle.

La riga e' cosi composta

COLONNA 1 : Select box (con 3 o + valori, generata dinamicamente a un ciclo in PHP)
COLONNA 2: input di text
COLONNA 3: Pulsante + che crea la copia della riga sotto

E cosi via fino all'infinito (quante volte schiaccia piu) inoltre per le righe create si ha un meno, che permette di toglierle.

Qualcuno di voi ha qualcosa di simile?

Potrei farlo aggiornando la pagina, ma non vorrei usare quel modo.

Grazie.
Antonio

[cavicchiandrea]

Guarda nelle discussioni (in evidenza di questo forum) c'è quello che ti serve.
Ciao

[Toniello]

mmmm, non l'ho trovato nella discussione.

Se riuscissi a sapere, solo come si potrebbe prendere il contenuto di una select box, quindi tutte le opzioni e metterle in un array, potrei costruirmela da solo la funzione.

Es, io ho una select

<select name="ciao" id="1">
<option value="1">Salve</option>
<option value="2">Ciao</option>
<option value="3">Arrivederci</option>
<option value="4">Addio</option>
</select>

alla pressione di un tasto, mi mette tutto il contenuto in un array.

Grazie

[cavicchiandrea]

Aggiungere input dinamicamente (nel tuo caso select oppure option)
http://forum.html.it/forum/showthrea...hreadid=848168
Aggiungere option da pop:
http://forum.html.it/forum/showthrea...2#post11515822
Come costruire un array:
http://javascript.html.it/guide/lezione/897/gli-array/

[Toniello]

Ciao,
posto il codice che ho creato che crea esattamente quello che volevo.

Se pensate che si possa migliorare in qualche modo, ogni consiglio e' ben accetto.

Questo e' il codice HTML

    <style>
        .dv_select {
            float: left;
            width: 100px;
            padding-top: 3px;
        }
        .bt_select {
            float: left;
        }
    </style>
    
    <form name="myform" method="post" action="">
            <div>
                <div class="dv_select">
                    <select name="query[1][value]" class="testo" id="select_1">
                        <option value="1">Ciao</option>
                        <option value="2">Salve</option>
                        <option value="3">Arivederci</option>
                    </select>
                </div>
                <div class="bt_select">
                    <button onClick="return Aggiungi(1)" id="bottone_1">+</button>
                </div>
                <div style="clear: left"></div>
            <div>
            <div id="cambia_1"></div>

        </table>
    </form> 

Questo e' il codice JS (Da includere come esterno)

function Aggiungi(value) {
    
    var select = '';
    for (i=0; i<document.getElementById('select_'+value).options.length; i++) {
        select = select + '<option value="' + document.getElementById('select_'+value).options[i].value + '">'+document.getElementById('select_'+value).options[i].text+'</option>';
    }

    nuovo = value+1;
    document.getElementById('cambia_'+value).innerHTML = '<div><div class="dv_select"><select name="query['+nuovo+'][value]" id="select_'+nuovo+'" class="testo">'+select+'</select></div><div class="bt_select"><button id="meno_'+nuovo+'" onClick="return Sottrai('+nuovo+')">-</button><button id="bottone_'+nuovo+'" onClick="return Aggiungi('+nuovo+')">+</button></div><div style="clear: left"></div><div><div id="cambia_'+nuovo+'"></div>';
    document.getElementById('bottone_'+value).style.display = 'none';

    return(false);
}

function Sottrai(value) {
    document.getElementById('meno_'+value).style.display = 'none';
    document.getElementById('select_'+value).style.display = 'none';
    return(false);
} 

Un saluto.
Antonio