An alternative ...

  var tgt = $('select:not(.addFrom)');
  $('#right').click(function(){
      var x = $(tgt).children();
      $('.addFrom option:selected').filter(function(){
          // remove, by value, selected options already in target...
          return (x.filter('[value="'+this.value+'"]').length==0);
        }).clone().appendTo(tgt).end(/*clone*/).end(/*filter*/)
        // all selected are processed so de-select...
        .each(function(){ this.selected = false; });
      return false;
    });
  $('#left').click(function(){
      $('option:selected', tgt).remove();
      return false;
    });

<select class='addFrom' multiple="multiple">
<option value="1">test 1</option>
<option value="2">test 2</option>
<option value="3">test 3</option>
</select>
<select class='addFrom' multiple="multiple">
<option value="4">test 4</option>
<option value="5">test 5</option>
<option value="6">test 6</option>
</select>
<select class='addFrom' multiple="multiple">
<option value="A">test A</option>
<option value="B">test B</option>
</select>
<button id='right'>&gt;&gt;</button>
<button id='left'>&lt;&lt;</button>
<select multiple="multiple">
</select>

On Oct 24, 11:07 am, Korijn <[EMAIL PROTECTED]> wrote:
> And what would I do in this case? Having multiple selectboxes to
> choose items from?
>
> I'm not sure if using prefixes in the valuables is a good idea to keep
> track of what item came from what selectbox but it's all I can come up
> with right now.
>
> <script type="text/javascript">
> //<![CDATA[
> $(document).ready(function() {
>         $("#right").click(function() {
>                 $("#options
> option:selected").clone().appendTo("#selection");
>                 return(false);
>         });
>         $("#left").click(function() {
>                 $("#selection option:selected").remove();
>                 return(false);
>         });
>
> });
>
> //]]>
> </script>
>
> <div id="options">
> <select id="options1" multiple="multiple">
> <option value="options1;1">test 1</option>
> <option value="options1;2">test 2</option>
> <option value="options1;3">test 3</option>
> </select>
>
> <select id="options2" multiple="multiple">
> <option value="options2;1">test 1</option>
> <option value="options2;2">test 2</option>
> <option value="options2;3">test 3</option>
> </select>
> </div>
>
> <button id="right">&gt;&gt;</button>
> <button id="left">&lt;&lt;</button>
>
> <select id="selection" multiple="multiple">
> </select>

Reply via email to