/    Sign up×
Community /Pin to ProfileBookmark

Adding to select box

Ok i have following problem.

I have a textfield and I select box. and two buttons. I would like to wirte something into the textfield and if i press the button next to it i would like to get it added to the select box.

And then if i highlight a item in the select box and press the delete button I would like that that item gets deleted from the box.

and then i would like to get all values from the select box and store it in one variable.

Is that possible??

[CODE]
Command
<input type=”text” name=”command”><br>
<INPUT
TYPE=”button”
NAME=”button1″
VALUE=”Add Command”
ONCLICK=””
Style=”width: 140;”
>

<br><br>Commands to run<br>
<select name=”comand_list” size=”10″ style=”width: 140;”>

</select>
<INPUT
TYPE=”button”
NAME=”button1″
VALUE=”Delete Command”
ONCLICK=””
Style=”width: 140;”
>

[/CODE]

to post a comment
JavaScript

2 Comments(s)

Copy linkTweet thisAlerts:
@stephan_gerlachauthorFeb 25.2005 — ups. sorry . dont know what happened here.

Can someone delete one of the two posts please??

thank you
Copy linkTweet thisAlerts:
@FangFeb 25.2005 — This does most of what you require:
&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd"&gt;
&lt;html lang="en"&gt;
&lt;head&gt;
&lt;title&gt;Copy selection from one box to another&lt;/title&gt;
&lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8"&gt;
&lt;script type="text/javascript"&gt;
&lt;!--
function InsertOption(To) {
var f=document.myform;
//get # options in To box
var Tolen=f.elements[To].options.length;
//insert selected item in To box
f.elements[To].options[Tolen]=new Option(f.user.value, f.user.value);
f.user.value="";
}

function MoveOptions(From, To) {
var f=document.myform;
//get # options in To box
var Tolen=f.elements[To].options.length;
//find selected in From box
for(var i=0; i&lt;f.elements[From].length; i++) {
if(f.elements[From].options[i].selected) {
//insert selected item in To box &amp; update index
f.elements[To].options[Tolen++]=new Option(f.elements[From].options[i].text, f.elements[From].options[i].value, true, true);
}
} <br/>
RemoveOptions(From);
}

function RemoveOptions(From) {
var f=document.myform;
//find selected in From box
for(var i=0; i&lt;f.elements[From].length; i++) {
if(f.elements[From].options[i].selected) {
//remove selected item From box
f.elements[From].options[i]=null;
}
} <br/>
}
//--&gt;
&lt;/script&gt;
&lt;style type="text/css"&gt;
&lt;!--
td {vertical-align:top;}
--&gt;
&lt;/style&gt;
&lt;/head&gt;
&lt;body&gt;
&lt;form name="myform" action="#"&gt;
&lt;table summary="option lists" border="1" cellpadding="3" cellspacing="0"&gt;
&lt;tr&gt;
&lt;td&gt;
&lt;input type="button" value=" Move &amp;gt;&amp;gt; " onclick="MoveOptions('left', 'right')"&gt;&lt;br&gt;
&lt;select name="left" ondblclick="RemoveOptions('left')" multiple="multiple"&gt;
&lt;option value="a"&gt;apple&lt;/option&gt;
&lt;option value="b"&gt;banana&lt;/option&gt;
&lt;option value="c"&gt;cranberry&lt;/option&gt;
&lt;/select&gt;
&lt;/td&gt;
&lt;td align="center"&gt;
&lt;div&gt;insert&lt;/div&gt;
&lt;input type="button" value=" &amp;lt;&amp;lt; " onclick="InsertOption('left')"&gt;
&lt;input type="text" name="user" size="7"&gt;
&lt;input type="button" value=" &amp;gt;&amp;gt; " onclick="InsertOption('right')"&gt;
&lt;p&gt;Double click selection to remove&lt;/p&gt;
&lt;/td&gt;
&lt;td&gt;
&lt;input type="button" value=" &amp;lt;&amp;lt; Move " onclick="MoveOptions('right', 'left')"&gt;&lt;br&gt;
&lt;select name="right" ondblclick="RemoveOptions('right')" multiple="multiple"&gt;
&lt;!-- added options here --&gt;
&lt;/select&gt;
&lt;/td&gt;
&lt;/tr&gt;
&lt;/table&gt; <br/>
&lt;/form&gt;
&lt;/body&gt;
&lt;/html&gt;
×

Success!

Help @stephan_gerlach 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.12,
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: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

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

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