How can I get multi select dropdown box?

I have two dropdown box. 1st box having list of values. When I click add button the selected value from dropdown1 shift to dropdown2. Then when I click "add all" button all the values from list will shift from dropdown1 to dropdown2 through jQuery. Here I am having problem.

After add the values from box1 to box2 when I click submit button the scrolldown of dropdown is automaticaly scrolling one time then ly values ll be submit. How can I avoid this. Here they are adding the list of values one by one to another box... how can I avoid this.

For example:

var arr =[];
$('#'+selectedValues+' option').each(function (i,option){ arr[i]=$(option).val();
$('input[type=submit]').click(function(){ $('#'+selectedID).val(arr);

From stackoverflow

• There is a jQuery plugin that does this for you...

  http://www.jsplugins.com/Scripts/Plugins/View/Jquery-Two-Sided-Multi-Selector/

  It converts a select list (multiple) into a two-sided list with options to move items back and forth etc.