hey,

i'm trying to implement this stuff.
user x can acces client 1, client 2, client 4

i want this on my site, 2 list, one with the available clients, and the other
with the clients the user can access

when i change a client from list 1 to list 2 (or reverse), it need to be sort again. Also i got this bug, when i switch for the first time, it has also the selected clients in the available clients list. The script given works also with 2 arrays and 2 list, and sorting it.

hope u guys can help me, or have a better script so that i just have to set the 2 arrays.

Select the clients that the user may access.
Available clients Selected clients
client 3 >> client 1
client 5 client 2
client 6 << client 4
client 7

thanks in advance

copy this in a blank html or so
HTML Code:
<html>
<body>


		<h3>Choose clients</h3>
		
		
<script language="javascript">
var tab_clienttype=new Array(),tab_ids_client=new Array(),tab_clienttype_choosen=new Array(),i=0,available_client,selected_client;


	tab_clienttype[106]="106;A.G.O.M. nv";
	tab_ids_client[i]=106;
	i++;

	tab_clienttype[103]="103;Accountantskantoor Vercruysse & Partners BVBA";
	tab_ids_client[i]=103;
	i++;

	tab_clienttype[8]="8;All Building Services nv";
	tab_ids_client[i]=8;
	i++;

	tab_clienttype[115]="115;Alpin Cleaning Ent";
	tab_ids_client[i]=115;
	i++;

	tab_clienttype[118]="118;Aronia nv";
	tab_ids_client[i]=118;
	i++;

	tab_clienttype[235]="235;Belcompany";
	tab_ids_client[i]=235;
	i++;

	tab_clienttype[274]="274;Brutyn2";
	tab_ids_client[i]=274;
	i++;

	tab_clienttype[160]="160;BYS";
	tab_ids_client[i]=160;
	i++;

	tab_clienttype[173]="173;CCandela";
	tab_ids_client[i]=173;
	i++;

	tab_clienttype[126]="126;Cinderella Cibo nv";
	tab_ids_client[i]=126;
	i++;

	tab_clienttype[127]="127;Cleandienst-Bouwschoon Vlaanderen nv";
	tab_ids_client[i]=127;
	i++;


function add_clienttype(formular)
{
	if(eval("document."+formular+"."+available_client+".options").selectedIndex != -1)
	{
		if(eval("document."+formular+"."+selected_client+".options").length == 1)
		{
			if(eval("document."+formular+"."+selected_client).options[0].value == 0)
			{
				
				eval("document."+formular+"."+selected_client).options[0]=null;
				
			}
		}
	}
	pos=eval("document."+formular+"."+selected_client+".options").length;
	for(i=0;i<eval("document."+formular+"."+available_client+".options").length;i++)
	{
		if(eval("document."+formular+"."+available_client+".options["+i+"]").selected)
		{
			strtempw=tab_clienttype[eval("document."+formular+"."+available_client+".options["+i+"]").value];
			strtempw=strtempw.split(';');
			strtemp2w=strtempw[0];
			tab_clienttype_choosen[strtemp2w]=strtemp2w;
			noption=new Option(strtempw[1],strtempw[0]);
			eval("document."+formular+"."+selected_client).options[pos]=noption;
			pos++;
		}
	}
	reconstruction_clienttype(formular);
}

function reconstruction_clienttype(formular)
{
	while(eval("document."+formular+"."+available_client+".options").length != 0)
	{
		eval("document."+formular+"."+available_client).options[0]=null;
	}
	pos=0;
	for(i=0;i<tab_ids_client.length;i++)
	{
		if(tab_clienttype[tab_ids_client[i]] != null)
		{
			strtemp=tab_clienttype[tab_ids_client[i]];
			strtemp=strtemp.split(';');
			strtemp2=strtemp[0];
			if(tab_clienttype_choosen[strtemp2] == null)
			{
				noption=new Option(strtemp[1],strtemp[0]);
				eval("document."+formular+"."+available_client).options[pos]=noption;
				pos++;
			}
		}
	}
}

function remove_clienttype(id)
{
	tab_clienttype_choosen[id]=id;
}

function delete_clienttype(formular)
{
	i=0;
	tab_temp_sect2=new Array();
	while(i<eval("document."+formular+"."+selected_client+".options").length)
	{
		if(eval("document."+formular+"."+selected_client).options[i].selected)
		{
			eval("document."+formular+"."+selected_client).options[i].selected=false;
			strtemp2=eval("document."+formular+"."+selected_client).options[i].value;
			tab_clienttype_choosen[strtemp2]=null;
			
				eval("document."+formular+"."+selected_client).options[i]=null;
			
			i=0;
		}
		else
		{
			i++;
		}
		
	}
	
	if(eval("document."+formular+"."+selected_client+".options").length == 0)
	{
		noption=new Option("[None]","0");
		eval("document."+formular+"."+selected_client).options[0]=noption;
	}
	reconstruction_clienttype(formular);
}

function init_clienttype(select1,select2)
{
	available_client=select1;
	selected_client=select2;
}


function SelectAllList(CONTROL){
	for(var i = 0;i < CONTROL.length;i++){
	CONTROL.options[i].selected = true;
	}
}

function DeselectAllList(CONTROL){
	for(var i = 0;i < CONTROL.length;i++){
	CONTROL.options[i].selected = false;
	}
}

</script>

<script type="text/javascript" language="javascript">
	init_clienttype("available_clienttype","selected_clienttype");
</script>
	66<br/>
	--<br/>
	
		--, 
	
	<form action="/users/add_clients/66" method="post" name="formClients">	
	<table>
		<tr>
			<td colspan="3">Select the clients that the user may access.</td>
		</tr>
		<tr> 
			<td>Available clients</td> 
			<td>&nbsp;</td> 
			<td>Selected clients</td> 
		</tr> 
		<tr> 
			<td>
				<a href="javascript:SelectAllList(document.formClients.available_clienttype);">select all</a> 
				&nbsp;&nbsp;
				<a href="javascript:DeselectAllList(document.formClients.available_clienttype);">deselect all</a>
			</td> 
			<td>&nbsp;</td> 
			<td>
				<a href="javascript:SelectAllList(document.formClients.selected_clienttype);">select all</a> 
				&nbsp;&nbsp;
				<a href="javascript:DeselectAllList(document.formClients.selected_clienttype);">deselect all</a>
			</td> 
		</tr> 
		<tr>
			<td> 
				<select name="available_clienttype[]" id="available_clienttype" multiple size="10" style="width:320px;" ondblclick="add_clienttype(this.form.name)"> 
					
						<option value="103">Accountantskantoor Vercruysse & Partners BVBA</option> 
					
						<option value="8">All Building Services nv</option> 
					
						<option value="115">Alpin Cleaning Ent</option> 
					
						<option value="235">Belcompany</option> 
					
						<option value="160">BYS</option> 
					
						<option value="173">CCandela</option> 
					
						<option value="126">Cinderella Cibo nv</option> 
					
						<option value="127">Cleandienst-Bouwschoon Vlaanderen nv</option> 
					
				</select>
			</td> 
			<td align="center">
				<input name="btnLtoRWtype" type="Button" value=">>" onclick="add_clienttype(this.form.name);"> 
				<br> 
				<input name="btnRtoLWtype" type="Button" value="<<" onclick="delete_clienttype(this.form.name);">
			</td> 
			<td>
				<select name="selected_clienttype[]" id="selected_clienttype" multiple size="10" style="width:320px;" ondblclick="delete_clienttype(this.form.name)"> 
					
						<option value="106">A.G.O.M. nv</option> 
					
						<option value="118">Aronia nv</option> 
					
						<option value="274">Brutyn2</option> 
					
				</select>
			</td> 
		</tr> 
		<tr>
			<td colspan="3" class="right"><input name="commit" type="submit" value="Update" /><input id="user_id" name="user[id]" type="hidden" value="66" /></td>
		</tr>
	</table>
	</form>


</body>
</html>