/    Sign up×
Community /Pin to ProfileBookmark

[RESOLVED] Copying selected options to another select box

I have what I thought was a really simple requirement but it’s proving to be trickier than expected:

The problem seems to be with multiple selections in select boxes.
The select boxes are called “test1” and “test2”.
On pressing a button, I need the selected items in “test1” to be selected in “test2”

I’m using part of a javascript kindly provided here by JMRKER in response to a similar issue:

[code=php]
function iterate2() {
var picked = ”;
for (i=0; i<document.getElementById(‘test1’).options.length; i++) {
if (document.getElementById(‘test1’).options[i].selected == true) { document.getElementById(‘test2’).options[i].selected = 1 }
}
}
[/code]

This works – to an extent! ?

The behaviour I observe is that this only copies the last selected option (ie: furthest from top of the list) from “test1” into “test2” and what I need is all selected options copied.

Help gratefully appreciated!

Vinny

to post a comment
JavaScript

7 Comments(s)

Copy linkTweet thisAlerts:
@FangAug 25.2008 — This snippet doesn't copy anything.

Do you want to copy the selected options in test1 to test2?
Copy linkTweet thisAlerts:
@vinnym70authorAug 25.2008 — Fang - indeed that's exactly what I want to do!

The snippet does work as described though. Just doesn't handle multiple selections, works perfect if just one option selected from the box. So was hoping I was *reasonably* close.

Vinny.
Copy linkTweet thisAlerts:
@FangAug 25.2008 — function iterate2() {
var picked = '';
var sel1=document.getElementById('test1');
var sel2=document.getElementById('test2');

for (var i=0; i&lt;sel1.options.length; i++) {
if (sel1.options[i].selected) {
sel2.options[sel2.options.length]=new Option(sel2.options[i].text, sel1.options[i].value);
}
}
}
Copy linkTweet thisAlerts:
@vinnym70authorAug 25.2008 — Many thanks but my bad on the first reply.

The options are already in the select box test2, they just need to be automatically selected:

So, the contents of test1 and test2 are static.

User selects multiple options in select box test1, these options then need to be selected in test2, not added.

Like I say, my bad.

Vinny
Copy linkTweet thisAlerts:
@FangAug 25.2008 — function iterate2() {
var picked = '';
var sel1=document.getElementById('test1');
var sel2=document.getElementById('test2');

for (var i=0; i&lt;sel1.options.length; i++) {
if (sel1.options[i].selected) {
sel2.options[i].selected=true;;
}
}
}
Copy linkTweet thisAlerts:
@vinnym70authorAug 25.2008 — Fang - many thanks but it suffers from the same problem as my original snip.

So, working great for single selections but multiple selections bork.

The only selected item in "test2" for multiple selections is the option furthest away from the top of "test1": ie:

Test1 select options 0, 1, 2, 3 and invoke function

Test2 all that is selected is option 3.

Now, I can see that options 0, 1 and 2 get selected briefly during execution as my PC is running like a dog and I could kinda see them flicker through a couple of times. I just don't understand why the multiple selections are such a chore!

Vinny
Copy linkTweet thisAlerts:
@vinnym70authorAug 25.2008 — Of course, doubting the javascript would be the logical option.

Unfortunately, this is down to user error.

The select tag multiple="multiple" was incorrectly spelt on the select box "test2" therefore, the javascript is working perfectly but multiple selections were not permitted on anything other than the box "test1"

Thanks [and apologies], especially to Fang!!

Vinny
×

Success!

Help @vinnym70 spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 6.1,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,
)...