Multiple select waarden van een naar de ander PDF Afdrukken

Als je een forumulier nodig hebt met 2 multiple selelects waarbij de waarden van één naar de ander verplaats moeten worden als de gebruiker op een knop klikt kan je onderstaande script gebruiken.

Zorg ervoor dat je Multiple select blokhaken naast de "name" hebben staan anders word het niet in php gezien als een array:

01.   <select name="srcList[]" size="15" id="srcList" multiple="multiple">

 

Het script word aangeroepen vanuit waar je de knoppen hebt staan met:

Multiple Select

 Voor de knop toevoegen:

01.   onclick="javascript:addSrcToDestList('srcList', 'destList');"

 

Voor de knop Verwijderen:

01.   onclick="javascript:addSrcToDestList('destList', 'srcList');"

 

  Javascript:

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

 

Omdat alleen geselecteerde opties worden gezien in bijvoorbeeld het PhP script dat erachter hangt moet je alle opties die
nu in het rechterscherm staan, te selecteren voor  dat de submit word uitgevoerd. Hier is ook een Javascriptje voor:

Deze hang je aan de formtag:

01.   <form id="form2" name="form2" method="post" onsubmit="selectAllOptions('destList');">

Dat roept onderstaand script aan:

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