ugrás a tartalomhoz

Multiple select elemeinek elérése

Dualon · 2005. Ápr. 13. (Sze), 22.55
Sziasztok!

Egy multiple select lista elemeit szeretném elérni Javascripttel. Az egész célja az lenne, hogy két lista közt tudjam ide-oda pakolászni a dolgokat, aztán az egyik lista elemeit szerver oldalon feldolgozhassam.

Adott mondjuk ez a form:
  1. <form method="post" name="urlap">  
  2.     <select name="slct[]" size="10" multiple>  
  3.        <option value="e1">Elem 1</option>  
  4.        <option value="e2">Elem 2</option>  
  5.        <option value="e3">Elem 3</option>  
  6.     </select>  
  7.     <select name="slct2[]" size="10" multiple>  
  8.     </select><br />  
  9.     <input type="button" value=" berak >> " onclick="atrak('be');" />  
  10.     <input type="button" value=" << kivesz " onclick="atrak('ki');" />  
  11.     <input type="submit" value=" mehet " />  
  12. </form>  
És hozzá ez a javascript:
  1. function atrak(mod)  
  2. {  
  3.     if ( mod == 'be' ) {  
  4.         forras = document.urlap.slct;  
  5.         cel = document.urlap.slct2;  
  6.     } else {  
  7.         forras = document.urlap.slct2;  
  8.         cel = document.urlap.slct;  
  9.     }  
  10.   
  11.     forras_hossz = forras.length;  
  12.     for (i=0; i<forras_hossz; i++) {  
  13.         if ( forras.options[i].selected == true ) {  
  14.             cel_hossz = cel.length;  
  15.             cel.options[cel_hossz] = new Option(forras.options[i].text);  
  16.         }  
  17.     }  
  18.   
  19.     for (i=(forras_hossz-1); i>=0; i--) {  
  20.         if ( forras.options[i].selected == true ) {  
  21.             forras.options[i] = null;  
  22.         }  
  23.     }  
  24. }  
Ha a multiselectek neve slct, illetve slct2 lenne - mint ahogy azt a javascriptben használtam -, tökéletesen menne a dolog, de akkor ugye szerver oldalon csak a sorban utolsó kiválasztott elemet kapnám meg.

Hogyan érem el a 'slct[]' lista elemeit?
document.urlap.slct nem jó,
document.urlap.slct[] nem jó,
document.urlap.slct[0] nem jó,
document.slct['e1'] nem jó.

Egyébként nem ragaszkodom feltétlenül a fenti kódhoz, ha van jobb megoldás... ,)
A segítséget előre is köszönöm!
‹ CSS ország, Opera vs Firefox INPUT FILE maszk? ›
 ■
1

submit buttony-ra

toxin · 2005. Ápr. 14. (Cs), 09.27
submit buttony-ra rákötnék egy ilyet:
<input type="submit" value="Mehet" name="submit" onclick="selectAllElement();">

javascript-ben meg lenne egy ilyenem
function selectAllElement(){
for (var i=0; i < document.urlap.select1.length; i++) document.urlap.select1.options[i].selected=true;
}

szerver oldalon a $_POST['select1'] -be ott lesz a select1 összes eleme, nem próbáltam, csak sztem :)
2

Használj ID-t

Nagy Péter · 2005. Ápr. 14. (Cs), 09.43
Mi volna ha a
<select name="slct[]" size="10" id="slct" multiple>
...
<select name="slct2[]" size="10" id="slct2" multiple>

alakot használnád? Akkor elérheted őket így:
slct1Obj = document.getElementById("slct");
slct2Obj = document.getElementById("slct2");
3

Kösz!

Dualon · 2005. Ápr. 14. (Cs), 10.52
toXin, valóban szükséges az összes elem kiválasztása, szerepel is a teljes kódban, csak a kérdésnél igyekeztem a "problémára és tartozékaira" összpontosítani. :) Ettől függetlenül körültekintésre utal bejegyzésed!

Tronic, a megoldás remek, és most már működik is minden.

A végleges változatot még annyival egészítettem ki, hogy az átrakott elem értéke is átkerül:
  1. new Option(forras.options[i].text, forras.options[i].value);  
Köszönöm mindkettőtöknek!
4

kicsit még gondolkoztam,

toxin · 2005. Ápr. 14. (Cs), 11.25
kicsit még gondolkoztam, és lenne egy kérdésem
<?php
print_r(explode(',',$_GET['selectArray']));
?>
<html>
<head>
<script type="text/javascript">
function finalize()
{
 tempArray=new Array();
 for (var i=0;i<document.test.testSelect.length;i++)tempArray[i]=document.test.testSelect.options[i].value
 document.getElementById('selectArray').value=tempArray;
}
</script>
</head>
<body>
<form name='test'  >
<select name="testSelect" size=10 multiple="multiple">
       <option value="e1">test1</option>
       <option value="e2">test2</option>
       <option value="e3">test3</option>
       <option value="e4">test4</option>
</select>
<input type="hidden" id="selectArray" name="selectArray" />
<input type="submit" value="mehet" onclick="finalize();" />
</form>
</body>
</html>


a hidden változóba hogyan kell js-en keresztül tömböt tölteni, értsd hogy a php-ban már ne kelljen explode-olni ?