Voorbeeld voor het omgaan met Select lijsten PDF Afdrukken

Onderstaande voorbeeld werkt. 

01.   function doehet(){
02.       var selObj = document.getElementById('sel1');
03.       var selIndex = selObj.selectedIndex;
04.       alert("Option Value: " + selObj.options[selIndex].value + 
05.       "\nTextWaarde:" +  selObj.options[selIndex].text);
06.       }

Eerst word het Select object met de naam "sel1"  in een variabele gestopt.
Dan word de geselecteerde waarde in een variabele gestopt.
Deze word dan gebruikt om de optie aan te geven in de lijst.

Hieronder een voorbeeld van 2 selects waar de waarde van de ene kant naar de andere kan worden gegooit.
Ik heb hieronder 1 van de 2 neergezet. De tweede is gewoon leeg en heet destList.

01.   <select name="srcList[]" size="15" id="srcList" multiple="multiple">
02.                  <option value="221">Adres 1</option>
03.                 <option value="233">Adres 2</option>
04.                 <option value="3445">Adres 3</option>
05.             </select>

 

In het midden staan 2 knoppen die geselecteerde waarden van de ene naar de select verplatsen.
Hieronder de javascript die dat regelt.

01.   function addSrcToDestList(src, dest) {
02.     
03.       srcList = document.getElementById(src); 
04.       destList = document.getElementById(dest);
05.   
06.       var len = destList.length;
07.       var srcLen = srcList.length;        
08.       for(var i = 0; i < srcLen; i++) {
09.         if ((srcList.options[i] != null) && (srcList.options[i].selected)) {
10.           
11.           //Check if this value already exist in the destList or not
12.           //if not then add it otherwise do not add it.
13.           var found = false;
14.           for(var count = 0; count < len; count++) {
15.             if (destList.options[count] != null) {
16.               if (srcList.options[i].text == destList.options[count].text) {
17.                 found = true;
18.                 break;
19.               }
20.             }
21.           }
22.           
23.           if (found != true) {
24.           // Hier zat de fout, nu wordt ook de value meegenomen.
25.             destList.options[len] = new Option(srcList.options[i].text, srcList.options[i].value);
26.             len++;
27.             
28.           }
29.         }
30.       }
31.       var i;
32.       for( i=srcList.options.length-1;i>=0;i-- )
33.           if ( srcList.options[i].selected)
34.                srcList.remove(i);
35.            
36.     }

Er is nog een functie nodig om de waarden in de rechterlijst vlak voor de submit allemaal te selectren, omdat alleen geselecteerde waarden worden opgevangen. De [..] in de selects maken er een array van.

01.   function selectAllOptions(selStr)
02.   {
03.     var selObj = document.getElementById(selStr);
04.     for (var i=0; i
05.       selObj.options[i].selected = true;
06.     }
07.   }

In een PhP script kan je het dan opvangen er hier iets mee doen:

01.   foreach($_POST['destList'] as $value) {
02.             
03.             echo "
04.   destList: " . $value;
05.             
06.       }