Precedente :: Successivo |
Autore |
Messaggio |
gek Eroe


Registrato: 22/01/06 16:55 Messaggi: 53 Residenza: Ravenna
|
Inviato: 28 Set 2008 16:47 Oggetto: select riempite al volo (select fill) con javascript |
|
|
buongiorno!
torno a voi con un'annosa situazione:
sto creando una pagina html con 3 select multipli (multiple="multiple"!):
1) la prima con le mail degli utenti
2) la seconda con le mail delle aziende
3) la terza vuota
vorrei, tramite javascript (ma sono pagine php, quindi se necessario si può ricorrere anche a questo linguaggio), cliccare su due pulsanti "ADD >>" e trasferire le mail selezionate dalle prime 2 select nella terza.
fin qui è abbastanza semplice direte voi! infatti l'ho già realizzato per conto mio!
JAVASCRIPT:
Codice: |
function addOption(theSel, theText, theValue){
var newOpt = new Option(theText, theValue);
var selLength = theSel.length;
theSel.options[selLength] = newOpt;
}
function deleteOption(theSel, theIndex){
var selLength = theSel.length;
if(selLength>0){
theSel.options[theIndex] = null;
}
}
function addRecipient(from,to){
var opt = document.getElementById(from);
var destinazione = document.getElementById(to);
var numofoptions = opt.length;
var selValue = new Array;
var j = 0;
for (i=numofoptions-1; i>=0; i--){
if (opt.options[i].selected == true){
selValue[j] = opt.options[i].value;
deleteOption(opt, i);
j++;
}
}
for(i=j-1; i>=0; i--){
addOption(destinazione, selValue[i], selValue[i]);
}
opt.options[1].selected = true;
}
function removeRecipient(from){
var selRec = document.getElementById(from);
/*
/////////////
*/
}
|
e CODICE HTML:
Codice: |
//prima select e relativo bottone
<select multiple="multiple" name="selectUtenti" id="selectUtenti">
<option value="" disabled="disabled">Elenco utenti</option>
<option value="one">1</option>
<option value="two">2</option>
<option value="three">3</option>
</select>
<br />
<input type="button" id="btnUtenti" name="btnUtenti" onclick="javascript: addRecipient('selectUtenti','selectRecipient');return false;" value="Add >>" />
//seconda select e relativo bottone
<select multiple="multiple" name="selectAttivita" id="selectAttivita">
<option value="" disabled="disabled">Elenco attività</option>
<option value="four">4</option>
<option value="five">5</option>
<option value="six">6</option>
</select>
<br />
<input type="button" id="btnUtenti" name="btnUtenti" onclick="javascript: addRecipient('selectAttivita','selectRecipient');return false;" value="Add >>" />
//terza select vuota
<select multiple="multiple" name="selectRecipient" id="selectRecipient">
<option value="" disabled="disabled">Chi riceverà l'email</option>
</select>
<br />
<input type="button" id="btnRemove" name="btnRemove" onclick="javascript: removeRecipient('selectRecipient');return false;" value="Remove <<" />
|
quello che non so realizzare è: come posso scrivere la funzione RemoveRecipient in modo tale che:
1) cancelli da selectRecipient l'indirizzo inserito
2) COSA DIFFICILE: ripristini l'indirizzo inserito dentro la corretta select?
ovvero come posso tener traccia al momento della "Add" di quale sia la select di origine di ogni elemento della select di destinazione?
ho provato ad aggiungere in ogni "option" un campo in più:
<option value="four" dadove="attiv">4</option>,
poi lo leggevo come
if (opt.options[i].dadove == 'attiv')
ma non funziona!! qlc idea?
grazie anticipatamente! |
|
Top |
|
 |
horus Macchinista


Registrato: 22/03/05 10:48 Messaggi: 2554 Residenza: Sirio e dintorni
|
Inviato: 29 Set 2008 09:05 Oggetto: |
|
|
Mah, un'idea potrebbe essere quella di tenere traccia degli elenchi mediante array una cosa del tipo:
Codice: |
// dichiari un arrai per le provenienze fuori dalle funzioni
var provenienze = new Array();
// quando aggiungi
function addRecipient(from, to)
{
// fai le tue cose
// dalle parti di addOption memorizzi la provenienza
provenienze[selValue[i]] = from; // se non ho capito male selValue contiene gli indirizzi e from l'id della select di provenienza, giusto?
}
// quando togli
function removeRecipient(from)
{
// recuperi la provenienza
var destinazione = provenienze[valore_da_rimettere_a_posto];
// fai quello che devi fare
} |
E' codice buttato lì, vedi tu se può essere adattato al tuo caso. |
|
Top |
|
 |
gek Eroe


Registrato: 22/01/06 16:55 Messaggi: 53 Residenza: Ravenna
|
Inviato: 29 Set 2008 12:53 Oggetto: |
|
|
per ora ho risolto così.
speravo ci fosse una soluzione un po' più elegante!!
per il momento grazie
 |
|
Top |
|
 |
SverX Supervisor Macchinisti


Registrato: 25/03/02 12:16 Messaggi: 11810 Residenza: Tokelau
|
Inviato: 29 Set 2008 17:24 Oggetto: |
|
|
... per esempio potresti NON rimuovere dagli elenchi gli elementi che hai selezionato. Se comunque vuoi che si 'vedano' potresti agire sul loro stile... |
|
Top |
|
 |
gek Eroe


Registrato: 22/01/06 16:55 Messaggi: 53 Residenza: Ravenna
|
Inviato: 30 Set 2008 00:36 Oggetto: |
|
|
.. uhmm intravedo la soluzione che mi suggerisci, ma ancora non la afferro nella sua totalità!
potrei nascondere dai select originali gli elementi spostati, ma come rendere poi più eleganti il controllo per verificare se provenivano dalla prima o dalla seconda select? |
|
Top |
|
 |
SverX Supervisor Macchinisti


Registrato: 25/03/02 12:16 Messaggi: 11810 Residenza: Tokelau
|
Inviato: 30 Set 2008 11:50 Oggetto: |
|
|
gek ha scritto: | potrei nascondere dai select originali gli elementi spostati, ma come rendere poi più eleganti il controllo per verificare se provenivano dalla prima o dalla seconda select? |
ah questo non saprei dire! Pensavo il tuo problema fosse che non potevi risalire a quale delle due liste l'elemento facesse parte inizialmente... se non lo rimuovi lo potrai ritrovare (scorrendo le liste...) |
|
Top |
|
 |
|