Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations Mike Lewis on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Add the selected value of 1 <select> to another?

Status
Not open for further replies.

rychand

Programmer
May 1, 2003
4
0
0
GB
How do you add the selected value of one combobox to another
I have a form with 2 selects like this:

<form id=&quot;form1&quot;>
<select id=&quot;countries&quot; onChange=&quot;loadCountry()&quot;>
<option value=&quot;France&quot;>France</option>
<option value=&quot;UK&quot;>UK</option>
</select>

<select id=&quot;country&quot;>
</select

the onchange=&quot;loadCountry()&quot; script looks something like
<script>
function loadCountry()
???form1.country.add???? = form1.countries.option(form1.countries.selectedindex).value
end function
</script>

So basically, how do i populate the combobox &quot;country&quot; with UK once i have selected it from countries?
I'm sure this is quite easy, so thanks for your help.
 
Take a look maybe this can help you.

<html>
<head>
<title>test</title>

<script language=&quot;Javascript&quot;>

/* Move values from the unselect box to the selected. */
function moveselectvalues()
{
var OutList = document.group.select_approver;

for (var i = 0; i < group.unselect_approver.options.length; i++)
{
if (group.unselect_approver.options.selected)
{
/* move values to the selected box and remove it
from the unselected box.
*/
iText = group.unselect_approver.options.text;
iValue = group.unselect_approver.options.value + '~~' + group.unselect_approver.options.text;
ReceiveOption(OutList,iText,iValue)
}
}
/* remove the values from the unselect box */
RemoveSelected(document.group.unselect_approver);

/* mark the last value selected in the select box */
SelectLastItem();
}

/* Move values from the select box to the unselect box */
function moveunselectvalues()
{
var OutList = document.group.unselect_approver;

for (var i = 0; i < group.select_approver.options.length; i++)
{
if (group.select_approver.options.selected)
{
/* Move the values to the unselect box and remove it
from the select box.
*/
iText = group.select_approver.options.text;
iValue = group.select_approver.options.value;
ReceiveOption(OutList,iText,iValue)
}
}
/* remove the value from the selected box */
RemoveSelected(document.group.select_approver);
}

/* clear any fields selected in the markets selected list box if
the user selects anything from the markets unselected list box
*/
function clearselected()
{
for (var i = 0; i < group.select_approver.options.length; i++)
{
if (group.select_approver.options.selected)
{
group.select_approver.options.selected = false;
}
}
}

/* clear any fields selected in the markets unselected list box
if the user selects anything from the markets selected list box
*/
function clearunselected()
{
for (var i = 0; i < group.unselect_approver.options.length; i++)
{
if (group.unselect_approver.options.selected)
{
group.unselect_approver.options.selected = false;
}
}
}

/* Add values to a combo box */
function ReceiveOption(OutList,iText,iValue)
{
newoption = new Option(iText,iValue,false,false);
OutList.options[OutList.length] = newoption;
}

/* Remove the values selected from the previous list
after they are moved to another list.
*/
function RemoveSelected(InList)
{
var deleteFlag = true;

while (deleteFlag == true)
{
deleteFlag = false;
for (var i=0; i < InList.length; i++)
{
if (InList.options.selected)
{
InList.options = null;
deleteFlag = true;
break;
}
}
}
group.btnremove.disabled=true;
}

/* select all items for the select list box */
function SelectAllListItems()
{
for (var i = 0; i < group.select_approver.options.length; i++)
{
group.select_approver.options.selected = true;
group.btnremove.disabled=false
group.btnadd.disabled=true
}
}

/* select last item for the select list box */
function SelectLastItem()
{
var i;
i = group.select_approver.options.length - 1
group.select_approver.options.selected = true;
group.btnremove.disabled=false;
group.btnadd.disabled=true
}

</script>

</HEAD>


<form ACTION=&quot;Chico21.asp&quot; METHOD=&quot;POST&quot; Name=&quot;group&quot;>

<TABLE align=&quot;center&quot; width=&quot;800&quot; cellspacing=&quot;0&quot; cellpadding=&quot;2&quot; border=&quot;1&quot;>
<tr>
<td>
<TABLE align=&quot;center&quot; cellspacing=&quot;0&quot; cellpadding=&quot;2&quot; border=&quot;0&quot;>
<tr><th align=&quot;center&quot;>Unselected</th><th>&nbsp;</th><th align=&quot;center&quot;>Selected</th></tr>
<tr>
<td ALIGN=&quot;center&quot;>
<select name=&quot;unselect_approver&quot; multiple size=&quot;5&quot; onclick='{btnadd.disabled=false;btnremove.disabled=true;clearselected();}'>
<option value=&quot;1&quot;>Name one</option>
<option value=&quot;2&quot;>Name two</option>
<option value=&quot;3&quot;>Name three</option>
<option value=&quot;4&quot;>Name four</option>
<option value=&quot;5&quot;>Name five</option>
<option value=&quot;6&quot;>Name six</option>
<option value=&quot;7&quot;>Name seven</option>
</select>
</td>

<td VALIGN=&quot;CENTER&quot; width=&quot;30&quot;>
<input disabled type=&quot;button&quot; align=&quot;center&quot; value=&quot; Add &quot; id=&quot;btnadd&quot; NAME=&quot;selection&quot; onClick=&quot;moveselectvalues();&quot; TITLE=&quot;Add a approver.&quot;>
&nbsp;&nbsp;&nbsp;
<input disabled type=&quot;button&quot; value=&quot;Remove&quot; id=&quot;btnremove&quot; NAME=&quot;selection&quot; onClick=&quot;moveunselectvalues();&quot; TITLE=&quot;Remove an approver.&quot;>
</td>

<td ALIGN=&quot;CENTER&quot;>
<select name=&quot;select_approver&quot; multiple size=&quot;10&quot; onclick='{btnadd.disabled=true;btnremove.disabled=false;clearunselected();}'>

</select>
</td></tr>
<tr><td>&nbsp;</td></tr>
</table>
</td></tr>
</table>

</form>
</body>
</html>
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top