Hello, all. If you open the following code (written primarily by a generous member of this forum ? ) in your browser, you’ll notice that there are two select boxes in which you can toggle values back and forth. It works perfectly except for being able to select multiple values from the second box and return them to the first. Any idea on what’s causing this?
[code]
<html>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=windows-1252″>
<title>Maintain Relationships</title>
<link rel=”StyleSheet” href=”stormy.css” media=”screen” type=”text/css” />
</head>
<body class=”text8″>
<script language=”javascript”>
<!–
function SendToAndRemove()
{
var Sel1=document.Relationships.selectName1;
var Sel2=document.Relationships.selectName2;
var len1=Sel1.length;
var len2=Sel2.length;
for(i=0; i<Sel1.length; i++)
{
found=false;
if(Sel1.options[i].selected)
{
for(j=0; j<Sel2.length; j++)
{
if(Sel2.options[j].value == Sel1.options[i].value)
{
found=true;
}
}
if(found == false)
{
Sel2.options[Sel2.length]=new
Option(Sel1.options[i].value, Sel1.options[i].text);
}
Sel1.options[i]=null;
len1–;
i–;
}
}
}
function SendBack()
{
var Sel1=document.Relationships.selectName1;
var Sel2=document.Relationships.selectName2;
var len2=Sel2.length;
var len1=Sel1.length;
for(i=0; i<Sel2.length; i++)
{
found=false;
if(Sel2.options[i].selected)
{
for(j=0; j<Sel1.length; j++)
{
if(Sel1.options[j].value == Sel1.options[i].value)
{
found=true;
}
}
if(found == false)
{
Sel1.options[Sel1.length]=new
Option(Sel2.options[i].value, Sel2.options[i].text);
}
Sel2.options[i]=null;
len2–;
i–;
}
}
}
//–>
</script>
<center>
<form id=”Relationships” name=”Relationships” method=”post”>
<div style=”border:solid gray 0px; width:700px”>
<div style=”float:left; border:solid yellow 0px; text-align:left; margin:0px 15px 0px 0px; padding:10px; background:rgb(230, 230, 240)”>
</div>
<div style=”float:left”>
<div style=”float:left; border:solid red 0px”>
<select id=”selectName1″ name=”selectName1″ multiple size=”10″ style=”width:300px”>
<option id=”” value=”carr1″>carr1</option>
<option id=”” value=”carr2″>carr2</option>
<option id=”” value=”carr3″>carr3</option>
</select>
</div>
<div style=”float:left”>
</div>
<div style=”clear:both; margin:5px 0px 10px 0px; text-align:left”>
<input type=”button” class=”text8″ value=”Add Selection(s) as Relationship(s)” onClick=”SendToAndRemove();”>
</div>
<div style=”clear:both; float:left; border:solid green 0px”>
<div style=”margin:10px 0px 0px 0px; text-align:left”>
</div>
<div style=”text-align:left”>
<select id=”selectName2″ name=”selectName2″ multiple size=”5″ style=”width:300px”>
</select>
</div>
</div>
<div style=”float:left; margin:30px 0px 0px 0px; text-align:left”>
<input type=”button” class=”text8″ value=”Remove” onClick=”SendBack();”><br />
</div>
</div>
</div>
</form>
</center>
</body>
</html>
Thank you very much for any assistance.
bubbis