Hey,
I'm trying to duplicate the following:
Select List 1
---
Apple
Orange
Banana
Select List 2 ( blank )
-------
I would like to have 2 buttons in between.
- Button 1 will transfer the selected value from List 1 to List 2
- Button 2 will transfer the selected value from List 2 to List 1
Both lists need to update. I've seen this on many sites, can anyone
help me
find a snippet on how to do this??
Thanks,
5  6789 
carrajo wrote: Hey,
I'm trying to duplicate the following:
Select List 1
---
Apple
Orange
Banana
Select List 2 ( blank )
-------
I would like to have 2 buttons in between.
- Button 1 will transfer the selected value from List 1 to List 2
- Button 2 will transfer the selected value from List 2 to List 1
Both lists need to update. I've seen this on many sites, can anyone
help me
find a snippet on how to do this??
Thanks, http://www.mattkruse.com/javascript/optiontransfer/
Simple, just populate using the Option() constructor, this is an old
example I made a while back:
<html>
<head>
<script language="javascript">
function getOpt(select1,select2)
{
for (bCnt=0;bCnt<select1.length;bCnt++)
{
if (select1.options[bCnt].selected)
{
newOpt=new
Option(select1.options[bCnt].text,select1.options[bCnt].value,false,false);
select2.options[select2.length]=newOpt;
}
}
}
function remOpt(select2)
{
for (bCnt=0;bCnt<select2.length;bCnt++)
{
if (select2.options[bCnt].selected)
select2.options[bCnt]=null;
}
}
</script>
</head>
<body>
<form>
<select name="oneS" multiple size="5">
<option value="http://www.hitsquad.com/smm/">Hitsquad Music
Machine, Shareware Archive (Windows, Linux, BeOS, MacOS, OS/2, MSDOS,
Atari)</option>
<option
value="http://www.sharewareplace.com/search.html">Shareware Place
Archive (Windows, MacOS)</option>
<option
value="http://www.scripps.edu/~mjhunter/shareware.html">Mike's
Shareware sites (Mac and PC)</option>
<option value="http://ded.com/nonags/">No Nags ( Win3.x, Win95,
WinNT )</option>
<option value="http://www.os2bbs.com/">Norloff's OS/2 Shareware
BBS ( OS/2 )</option>
<option value="http://tigger.stcloud.msus.edu/~hoffad01">One
Stop Software Shoppe ( Win3.x, Win95/98 )</option>
<option
value="http://godzilla.eecs.berkeley.edu/os2/software/shareware/shareware.html">OS/2
Freeware and Shareware ( OS/2 )</option>
<option value="http://www.pacinfo.com/archive/">PacInfo Software
Archive ( Win3.x, Mac )</option>
<option value="http://papa.indstate.edu:8888/">Papa Winsock L (
Winsock, Win3.x, Win95/98 )</option>
<option value="http://www.pcmag.com/download/dl-home.htm">PC
Magazine's Downloadable Files Area ( Win3.x, Win95/98, WinNT
)</option>
<option
value="http://www.bae.ncsu.edu/bae/people/faculty/walker/hotlist/pcutil.html">PC
Utilities ( Win3.x, Win95/98, MS-Dos )</option>
<option value="http://www.pcwin.com/software.html">PC Win
Resource Center ( Win95/98 )</option>
<option
value="http://users.aol.com/ericb98398/index.html">Personal
Microcosm's Shareware ( Win3.x, Win95/98, WinNT )</option>
<option value="http://www.schaft.com/ftpfiles.html">Schaft's
Windows Shareware Archive ( Winsock, Win3.x, Win95/98 )</option>
<option value="http://www.taynet.com/saver/">Screen Saver Central
( Win3.x, Win95/98 )</option>
<option value="http://www.sirius.com/~ratloaf/">Screen Savers for
Windows from A to Z ( Win3.x, Win95/98, Mac )</option>
<option value="http://www.sharewarejunkies.com">Shareware
Junkies ( Win3.x, Win95/98, MS-Dos, Mac, OS/2 )</option>
<option
value="http://www.geocities.com/Hollywood/7956/index.html">Simpson's
Software Home Page ( Win3.x, Win95/98, MS-Dos, Mac )</option>
<option value="http://www.coast.net/SimTel/">SimTel Software
Repository ( Win3.x, Win95/98, WinNT, MS-Dos, OS/2 )</option>
</select>
<br>
<input type="button" value="Add"
onClick="getOpt(this.form.oneS,this.form.twoS)">
<br>
<input type="button" value="Remove"
onClick="remOpt(this.form.twoS)">
<br>
<select name="twoS" multiple size="5">
</select>
</form>
</body>
</html>
Danny
Thans bud. Exactly what I was looking for.
Danny wrote:
Simple, just populate using the Option() constructor, this is an old
example I made a while back:
You should perhaps have updated it:
<html>
<head>
<script language="javascript">
The language attribute is deprecated, type is required.
function getOpt(select1,select2)
{
for (bCnt=0;bCnt<select1.length;bCnt++)
Don't use global variables unless needed, particularly ones used as
counters.
{
if (select1.options[bCnt].selected)
{
newOpt=new
Option(select1.options[bCnt].text,select1.options[bCnt].value,false,false);
select2.options[select2.length]=newOpt;
This is a poor attempt to clone an existing option. The HTMLElement
cloneNode() method would be far better, but you can simply move the
option from one select to the other.
The 'remOpt() is therefore redundant (it also unnecessarily replicates
logic from this function).
[...]
Here's an alternative that is significantly more efficient:
function moveSelectedOpts(fromSel, toSel)
{
var opt, opts = fromSel.options;
for (var i=0; i<opts.length; ++i) {
opt = opts[i];
if (opt.selected) {
toSel.appendChild(opt);
}
}
}
Normally I'd have used a variable to store the value of opts.length, but
since it changes as options are moved across to the other select, it is
kept 'live'.
The function can be called with:
<input type="button" value="Add"
onclick="moveSelectedOpts(this.form.oneS, this.form.twoS)">
--
Rob
RobG wrote:
[...]
Here's an alternative that is significantly more efficient:
Ooops, insufficient testing, here's a fixed version:
function moveSelectedOpts(fromSel, toSel)
{
var opt, opts = fromSel.options;
for (var i=0; i<opts.length; ++i) {
opt = opts[i];
if (opt.selected) {
toSel.appendChild(opt);
i -= 1;
}
}
}
In the original, if consecutive options are selected, every second one
is skipped unless the counter is re-set. My bad. Here's another verison:
function moveSelectedOpt(fromSel, toSel)
{
var opts = fromSel.options;
for (var i=0; i<opts.length; ++i) {
opts[i].selected && toSel.appendChild(opts[i]) && (i-=1);
}
}
--
Rob This thread has been closed and replies have been disabled. Please start a new discussion. Similar topics
by: StephenMcC |
last post by:
Hi All,
Got a quick query in relation to the Server.Transfer method available in IIS
5+/ASP. I've got an issue where I want to take a portion of an online app and
extract this out into a web...
|
by: callmebill |
last post by:
I'm relatively new to javascript, and I'm trying to decide whether the
following (and if so, clues on how to do it):
I'd like to create two HTML multiple-select boxes. The first would be
a list...
|
by: Kay |
last post by:
Hello,
I have two list boxes on my form, one initially displays blank, and through
javascript it is possible to move items from one box to another, this works
fine, I followed an article titled...
|
by: bryan |
last post by:
I've got a custom HttpHandler to process all requests for a given
extension. It gets invoked OK, but if I try to do a Server.Transfer I
get an HttpException. A Response.Redirect works, but I really...
|
by: plmanikandan |
last post by:
Hi,
I am new to link list programming.I need to traverse from the end of
link list.Is there any way to find the end of link list without
traversing from start(i.e traversing from first to find the...
|
by: Rob Long |
last post by:
Hi
I have an HTML select element in my page and it's multiple property is
disabled (one item at a time mode) but I still want to transfer all the
items in the select to the server when the form...
|
by: imrantbd |
last post by:
This is my first problem.Please help me.
I have the following code:
<head>
<script language="JavaScript">
function addSrcToDestList() {
destList1 = window.document.forms.destList;
srcList...
|
by: imrantbd |
last post by:
I need array type name like "destList" must use for my destlist select box,not a single name.Or need a solution to capture multiple value of "destList" select box and send all selected value in php...
|
by: Daz |
last post by:
Hi everyone.
I just wanted to know if there was any way to use script to display a
list of methods linked to a particular object? The object I have in
mind is getBrowser(), and I can't seem to...
|
by: CloudSolutions |
last post by:
Introduction:
For many beginners and individual users, requiring a credit card and email registration may pose a barrier when starting to use cloud servers. However, some cloud server providers now...
|
by: isladogs |
last post by:
The next Access Europe User Group meeting will be on Wednesday 3 Apr 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM).
In this session, we are pleased to welcome former...
|
by: ryjfgjl |
last post by:
In our work, we often need to import Excel data into databases (such as MySQL, SQL Server, Oracle) for data analysis and processing. Usually, we use database tools like Navicat or the Excel import...
|
by: taylorcarr |
last post by:
A Canon printer is a smart device known for being advanced, efficient, and reliable. It is designed for home, office, and hybrid workspace use and can also be used for a variety of purposes. However,...
|
by: aa123db |
last post by:
Variable and constants
Use var or let for variables and const fror constants.
Var foo ='bar';
Let foo ='bar';const baz ='bar';
Functions
function $name$ ($parameters$) {
}
...
|
by: emmanuelkatto |
last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud.
Please let me know.
Thanks!
Emmanuel
|
by: BarryA |
last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
|
by: Sonnysonu |
last post by:
This is the data of csv file
1 2 3
1 2 3
1 2 3
1 2 3
2 3
2 3
3
the lengths should be different i have to store the data by column-wise with in the specific length.
suppose the i have to...
|
by: Hystou |
last post by:
There are some requirements for setting up RAID:
1. The motherboard and BIOS support RAID configuration.
2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
| |
