Umm ....
Be very, very careful with that last modification, because if you
select options in one or more of your addFrom selects without actually
adding them to the target select, then select and remove something
from the target select, you will probably find that the selected
options in the addFrom selects will also disappear!
I tested on FF and IE7 and it works fine, but only using the HTML
given in the example.
You may well need to modify some selectors and/or ids/classes in order
to accommodate the rest of your page's HTML.
On Oct 25, 11:05 am, Korijn <[EMAIL PROTECTED]> wrote:
> Thanks alot! That did the trick for me. =)
> Surprisingly I had to remove tgt from the last selector in order for
> it to work properly though. Which confuses me. But hey it works fine.
> Thanks!
>
> (So this
>
> $('option:selected', tgt).remove();
>
> became
>
> $('option:selected').remove();
>
> )
>
> On 25 okt, 11:36, Wizzud <[EMAIL PROTECTED]> wrote:
>
> > 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'>>></button>
> > <button id='left'><<</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">>></button>
> > > <button id="left"><<</button>
>
> > > <select id="selection" multiple="multiple">
> > > </select>
