Diferent type of Form Select

[Ezkiel]

Hi,

 

I don't know how create Form Select with the characteristics presented in the image attached. The "Search" is for search the options in the first window, and we choose the options we want pushing the sum symbol button for the other window (right).

 

How I do?

 

 

 

 

 

[buzzycoder]

This code will might help you:

 

 

HTML Code :

<select class='sel' id='left' multiple>
<option value='1'>one</option>
<option value='2'>two</option>
<option value='3'>three</option>
<option value='4'>four</option>
<option value='5'>five</option>
<option value='6'>six</option>
</select>
 
<input type='button' value='>>' onclick='move(0)'>
<input type='button' value='<<' onclick='move(1)'>
 
<select class='sel' id='right' multiple>
</select>

Javascript Code :

<script type="text/javascript">
function move(direction)
{
	var src = document.getElementById('left' )
	var trg = document.getElementById('right' )	
	var tem
 
	if(direction)
	{
		tem = src
		src = trg
		trg = tem
	}
 
	var selected = []
 
	for(var i in src.options)
	{
		if(src.options[i].selected)
		{
			trg.options.add(new Option(src.options[i].text, src.options[i].value));
			selected.unshift(i);
		}
	}
 
	for(i in selected)
		src.options.remove(selected[i]);
}
</script>