/    Sign up×
Community /Pin to ProfileBookmark

update 2nd select option list

My function below is not working properly.

I have two select boxes which have the same option list.

When user selected the option for box 1, the same option will be removed from box 2 — this part is working fine.

However, if the user changes the original option to another option in box 1 , I would like the option list of box 2 to “include back” the original option and with the another option removed from the list — this is the part that is not working.


———————————————————————

function Operator2List() {
var Op1=document.getElementById(“x_P_By_Operator1”);
var Op2=document.getElementById(“x_P_By_Operator2”);

if (Op1.length!=Op2.length) {

document.getElementById(“x_P_By_Operator2”).value = document.getElementById(“x_P_By_Operator1”).options;

}

Op2.remove(Op1.selectedIndex);

}
———————————————————————

Any suggestion? Thank you very much!

to post a comment
JavaScript

7 Comments(s)

Copy linkTweet thisAlerts:
@Logic_AliOct 29.2008 — My function below is not working properly.

I have two select boxes which have the same option list.

When user selected the option for box 1, the same option will be removed from box 2 -- this part is working fine.

However, if the user changes the original option to another option in box 1 , I would like the option list of box 2 to "include back" the original option and with the another option removed from the list[/quote]


[URL]http://scripterlative.com/files/selectunique.htm[/URL]
Copy linkTweet thisAlerts:
@rbh033authorOct 29.2008 — Hi Logic Ali

Thank you for the site! The setup for the colour preference selection boxes is what I wanted. However, the code is too advanced for a new bee like me. Really have no idea what is performing. Mind to explain briefly?

Thank you very much!!
Copy linkTweet thisAlerts:
@vwphillipsOct 29.2008 — [CODE]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
<title></title>
<script language="JavaScript" type="text/javascript">
/*<![CDATA[*/

function Test(sels,selt,srt){
sels=document.getElementById(sels);
selt=document.getElementById(selt);
var options=selt.options;
if (!selt.save){
selt.save=[]
for (var zxc0=srt;zxc0<options.length;zxc0++){
selt.save.push(options[zxc0].cloneNode(true));
}
}
var selected=sels.options[sels.selectedIndex]
selt.options.length=srt;
for (var zxc1=srt;zxc1<selt.save.length;zxc1++){
if (selt.save[zxc1].value!=selected.value){
selt.appendChild(selt.save[zxc1].cloneNode(true));
}
}
}
/*]]>*/
</script></head>

<body>
<select id="s" onchange="Test('s','t',0);">
<option value="1" >One</option>
<option value="2" >Two</option>
<option value="3" >Three</option>
</select>
<select id="t" >
<option value="1" >One</option>
<option value="2" >Two</option>
<option value="3" >Three</option>
</select>
</form>
</body>

</html>[/CODE]
Copy linkTweet thisAlerts:
@rbh033authorOct 30.2008 — Hi Vic

Thank you for the code! It is short! and working. ?

In the Test javascripts function, what is that condition in the first IF portion? ie.

if (!selt.save){ <-- what is this?

selt.save=[] <-- creating an empty array?


Hope you can enlighten me. Thank you very much!!
Copy linkTweet thisAlerts:
@vwphillipsOct 30.2008 — [CODE]<script language="JavaScript" type="text/javascript">
/*<![CDATA[*/

function Test(sels,selt,srt){
sels=document.getElementById(sels);
selt=document.getElementById(selt);
var options=selt.options;
if (!selt.save){ only store the original options if the ary does not exist(the first time the function is called)
selt.save=[]; // create an an array(as a property of the target select) to store copies of the original options
for (var zxc0=srt;zxc0<options.length;zxc0++){
selt.save.push(options[zxc0].cloneNode(true)); // store the option copies in the arry
}
}
var selected=sels.options[sels.selectedIndex]
selt.options.length=srt;
for (var zxc1=srt;zxc1<selt.save.length;zxc1++){
if (selt.save[zxc1].value!=selected.value){
selt.appendChild(selt.save[zxc1].cloneNode(true));
}
}
}
/*]]>*/
</script>[/CODE]
Copy linkTweet thisAlerts:
@Logic_AliOct 30.2008 — Hi Logic Ali

Thank you for the site! The setup for the colour preference selection boxes is what I wanted. However, the code is too advanced for a new bee like me. Really have no idea what is performing. Mind to explain briefly?

[/quote]
Certainly - just post your teacher's email address.
Copy linkTweet thisAlerts:
@rbh033authorOct 30.2008 — THANK YOU VIC!! I got my function working now...
×

Success!

Help @rbh033 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 5.2,
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: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,

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