hello.
so i have 2 select menus which add and remove options from a 3rd select menu... it seems, however, that it's not possible to use different select menus to toggle a 3rd, because when an options[#] is removed, the list's options switch, making written javascript unusable?
the following code is an example: -
<script type="text/javascript">
-
-
function ToggleEmail()
-
{
-
if (document.form.email.value == "Select2")
-
{
-
AddEmailToList()
-
}
-
else{
-
RemoveEmailFromList()
-
}
-
}
-
-
function RemoveEmailFromList()
-
{
-
if (document.form.list.options[2].text == "Email")
-
{document.form.list.options[2] = null;}
-
}
-
-
function AddEmailToList()
-
{
-
var EMAIL = document.form.list;
-
if (EMAIL.options[2].text != "Email") {
-
EMAIL.options[3] = new Option(EMAIL.options[2].text, EMAIL.options[2].value);
-
var option = new Option("Email", "List2");
-
EMAIL.options[2] = option;
-
}
-
}
-
-
function ToggleTakeOut()
-
{
-
if (document.form.takeout.value == "SelectC")
-
{
-
AddTakeOutToList()
-
}
-
else{
-
RemoveTakeOutFromList()
-
}
-
}
-
-
function RemoveTakeOutFromList()
-
{
-
if (document.form.list.options[3].text == "Take Out")
-
{document.form.list.options[3] = null;}
-
}
-
-
function AddTakeOutToList()
-
{
-
var TAKEOUT = document.form.list;
-
if (TAKEOUT.options[3].text != "Take Out") {
-
TAKEOUT.options[3] = new Option(TAKEOUT.options[3].text, TAKEOUT.options[3].value);
-
var option = new Option("Take Out", "List3");
-
TAKEOUT.options[3] = option;
-
}
-
}
-
-
</script>
-
</head>
-
-
<body>
-
<form id="form" name="form">
-
<p>A)
-
<select name="email" id="email" onchange="ToggleEmail();">
-
<option value="Select0" selected></option>
-
<option value="Select1">Remove Email From List</option>
-
<option value="Select2">Add Email To List</option>
-
</select>
-
</p>B)
-
<select name="takeout" id="takeout" onchange="ToggleTakeOut();">
-
<option value="SelectA" selected></option>
-
<option value="SelectB">Remove Take Out</option>
-
<option value="SelectC">Add Take Out</option>
-
</select>
-
-
<p>Final List</p>
-
<select name="list" id="list">
-
<option value="List0"></option>
-
<option value="List1">Courier</option>
-
<option value="List2">Email</option>
-
<option value="List3">Take Out</option>
-
</select>
-
</p>
-
</form>
-
</body>
-
</html>
-
7  16896   iam_clint 1,208
Recognized Expert Top Contributor
I seen you tried to make a good attempt at this
I fixed up your code alittle bit (alot) :P and this should work for you... nice attempt at it though try to learn off what i'm giving you now -
<script type="text/javascript">
-
function Toggle(val) {
-
if (val == "RemEmail") {
-
RemoveItem("Email");
-
}
-
if (val == "RemTakeOut") {
-
RemoveItem("Take Out");
-
}
-
if (val == "AddEmail") {
-
AddItem("Email");
-
}
-
if (val == "AddTakeOut") {
-
AddItem("Take Out");
-
}
-
}
-
function AddItem(val) {
-
var list = document.form.list.options;
-
var exists = false;
-
for (i=0; i<=list.length-1; i++) {
-
if (list[i].text == val) { exists = true; }
-
}
-
if (exists == false) {
-
var option = new Option(val, val);
-
list[list.length] = option;
-
}
-
}
-
function RemoveItem(val) {
-
var list = document.form.list.options;
-
for (i=0; i<=list.length-1; i++) {
-
if (list[i].text == val) { list[i] = null; }
-
}
-
}
-
</script>
-
</head>
-
<body>
-
<form id="form" name="form">
-
<p>A)
-
<select name="email" id="email" onchange="Toggle(this.value);">
-
<option value="Select0" selected></option>
-
<option value="RemEmail">Remove Email From List</option>
-
<option value="AddEmail">Add Email To List</option>
-
</select>
-
</p>B)
-
<select name="takeout" id="takeout" onchange="Toggle(this.value);">
-
<option value="SelectA" selected></option>
-
<option value="RemTakeOut">Remove Take Out</option>
-
<option value="AddTakeOut">Add Take Out</option>
-
</select>
-
<p>Final List</p>
-
<select name="list" id="list">
-
<option value="List0"></option>
-
<option value="List1">Courier</option>
-
<option value="List2">Email</option>
-
<option value="List3">Take Out</option>
-
</select>
-
</p>
-
</form>
-
</body>
-
</html>
-
thanks a lot iam_clint! you're code is so much more compact than my crazy code... and it works to boot! thanks again :-)
I seen you tried to make a good attempt at this
I fixed up your code alittle bit (alot) :P and this should work for you... nice attempt at it though try to learn off what i'm giving you now
actually, i have one last burning question concerning this script... when the option is added back to the select list, does it have it's original value? so if (example) "Email" is removed, and then added back, will "Email" still have it's original "List2" value?
if not... how do i tweek this script to make sure the item's maintain their original values? (for PHP Script reasons)
acoder 16,027
Recognized Expert Moderator MVP
If you want that, pass the text and value to the add function, e.g. - if (val == "AddEmail") {
-
AddItem("Email","List2");
-
}
then in your AddItem function: - function AddItem(txt,val) {
-
var list = document.form.list.options;
-
var exists = false;
-
for (i=0; i<=list.length-1; i++) {
-
if (list[i].text == txt) { exists = true; }
-
}
-
if (exists == false) {
-
var option = new Option(txt, val);
-
list[list.length] = option;
-
}
-
}
An Option object has optional arguments such as text, value, defaultSelected and selected.
wow... it now works amazing... thanks so much guys for you help
wow... it now works amazing... thanks so much guys for you help
oh wait... hah... sorry to carry on this discussion... anyway, so the new code works fine... but i'm concerned because when an option is added back, even if it has the "List2" value, it's listed last... the previous "List3" value is now second...(so i'm assuming the "List3" value is now "List2"??)
so does that mean that in a 3 option drop menu there are two options with "List2" values? or does the original "List3" that has been displaced maintain it's value of "List3" and therefore "List2" and "List3" are simply no longer in order?
i hope that's not confusing...
oh... nevermind... i just realized that the order (options[0], options[1], etc.) changes, but the value should stay the same... and that shouldn't effect a PHP script that is relying on option values...
please excuse... :-)
Sign in to post your reply or Sign up for a free account.
Similar topics | |
by: Ramamoorthy Ramasamy |
last post by:
Hi all,
I would like to create a page with VBscript and ASP which will contain
two list-boxes one in the left side and the other in the right side
with two buttons namely "Add>>" and "<<Remove" so that if the user
selects a value listed in the left side list-box and presses "Add>>"
then that selected value should go inside the right side list-box.
Similarly if the user selects a value listed in the right side
list-box and after clicking...
|
by: Rob |
last post by:
Hi,
I've got a small javascript problem and I'm kinda stuck. I'm using
classic ASP. I have a select box which is populated by a database query
and there is a buttom that when clicked it will move the selected item
from the first select box and move it to another select box:
document.form2.list.options = new
Option(count + 1 + ". " + name,company);
Then I want to remove it from the first select box:
|
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 of items, and the second would be a list of categories. By
clicking a category in the 2nd box, the members of that category (from
the first box) would be highlighted (indicated here by arrows). E.g.,
-- List of Nums -- -- Categories --
1...
|
by: Stefan Finzel |
last post by:
Hi
trying to remove one or all elements of select options fails for Pocket
Internet Explorer. Is there a way to do this?
if is_PIE {
// this does not work on Pocket IE
while (opt.length) {
opt.remove(0);
}
|
by: rkrishna |
last post by:
I have an issue that I am trying to solve. I have three select lists
(supposed to be preference 1, 2,3) and each of them have the same three
options. As soon as I select one of the choices from list1, i would
like to remove it from the options of list 2 and so on for list 3.
So effectively, List 2 has two choices and List3 only has one choice
that can be made.
Any pointers on how to accomplish this?
| | |
by: Ian Richardson |
last post by:
Hi,
The function I've put together below is a rough idea to extend a SELECT
list, starting from:
<body>
<form name="bambam">
<select id="fred">
<option value="1">1</option>
<option value="2">2</option>
|
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 = window.document.forms.srcList;
|
by: Beholder |
last post by:
I hope that someone can help me with the following:
Short background explenation:
I have a shrfepoint page (newform.aspx) in a item list. On this page is
a lookup column that displays a lookup of all category items in
previous items. In the code this results in a select/options list like
this:
<SELECT TABINDEX=1
NAME="urn:schemas-microsoft-com:office:office#CatLookup"><OPTION
|
by: Richard Maher |
last post by:
Hi,
I have read many of the copius entries on the subject of IE performance (or
the lack thereof) when populating Select Lists.
I don't mind the insert performance so much, (I get 100x120byte rows
inserted/sec up to 500, and 100rows/6secs up to 3000, which isn't great but
then the Row Count is clicking away for the user to see and they can hit the
"cancel" button at anytime, so overall I'm happy), what really disappoints
me is the...
|
by: Hystou |
last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can effortlessly switch the default language on Windows 10 without reinstalling. I'll walk you through it.
First, let's disable language synchronization. With a Microsoft account, language settings sync across devices. To prevent any complications,...
|
by: jinu1996 |
last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that captivates audiences and drives business growth.
The Art of Business Website Design
Your website is...
| | |
by: tracyyun |
last post by:
Dear forum friends,
With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the choice of these technologies. I'm particularly interested in Zigbee because I've heard it does some...
|
by: agi2029 |
last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own....
Now, this would greatly impact the work of software developers. The idea...
|
by: isladogs |
last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 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 a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules.
He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms.
Adolph will...
|
by: conductexam |
last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one.
At the time of converting from word file to html my equations which are in the word document file was convert into image.
Globals.ThisAddIn.Application.ActiveDocument.Select();...
|
by: TSSRALBI |
last post by:
Hello
I'm a network technician in training and I need your help.
I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs.
The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols.
I succeeded, with both firewalls in the same network. But I'm wondering if it's possible to do the same thing, with 2 Pfsense firewalls...
|
by: adsilva |
last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
| | |
by: muto222 |
last post by:
How can i add a mobile payment intergratation into php mysql website.
| |
