Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > Javascript > Dependent listboxes

Reply
Thread Tools

Dependent listboxes

 
 
Simon Templar
Guest
Posts: n/a
 
      10-30-2004
I need the following functionality: With 2 listboxes populated from a
database with the SAME data, I need any of the listboxes to stop displaying
the option when selected at the other listbox. Eg: data records are A and B,
and initially are available in both listboxes, but once the user selects A
in the first listbox, the second one should only display B.

Any reference?


 
Reply With Quote
 
 
 
 
McKirahan
Guest
Posts: n/a
 
      10-30-2004
"Simon Templar" <(E-Mail Removed)> wrote in message
news:(E-Mail Removed)...
> I need the following functionality: With 2 listboxes populated from a
> database with the SAME data, I need any of the listboxes to stop

displaying
> the option when selected at the other listbox. Eg: data records are A and

B,
> and initially are available in both listboxes, but once the user selects A
> in the first listbox, the second one should only display B.
>
> Any reference?
>


Will this help? Watch for word-wrap.

<html>
<head>
<title>selnodup.htm</title>
<script type="text/javascript">
function noDuplicate() {
var form = document.forms[0];
var valu = form.Sel1.options[form.Sel1.selectedIndex].value;
form.Sel2.options[valu] = null;
}
</script>
</head>
<body>
<form>
<b>From :</b>
<select name="Sel1" onchange="noDuplicate()">
<option value="">
<option value="1">Chicago
<option value="2">New York
</select>
&nbsp; &nbsp;
<b>To :</b>
<select name="Sel2">
<option value="">
<option value="1">Chicago
<option value="2">New York
</select>
</form>
</body>
</html>



 
Reply With Quote
 
 
 
 
Simon Templar
Guest
Posts: n/a
 
      11-01-2004
This code works fine. The only problem appears when the user changes their
selection. The second listbox does not show the hidden option back. I will
try to improve that.

Thanks!

"McKirahan" <(E-Mail Removed)> escribió en el mensaje
news:qMSgd.335583$3l3.245825@attbi_s03...
> "Simon Templar" <(E-Mail Removed)> wrote in message
> news:(E-Mail Removed)...
> > I need the following functionality: With 2 listboxes populated from a
> > database with the SAME data, I need any of the listboxes to stop

> displaying
> > the option when selected at the other listbox. Eg: data records are A

and
> B,
> > and initially are available in both listboxes, but once the user selects

A
> > in the first listbox, the second one should only display B.
> >
> > Any reference?
> >

>
> Will this help? Watch for word-wrap.
>
> <html>
> <head>
> <title>selnodup.htm</title>
> <script type="text/javascript">
> function noDuplicate() {
> var form = document.forms[0];
> var valu = form.Sel1.options[form.Sel1.selectedIndex].value;
> form.Sel2.options[valu] = null;
> }
> </script>
> </head>
> <body>
> <form>
> <b>From :</b>
> <select name="Sel1" onchange="noDuplicate()">
> <option value="">
> <option value="1">Chicago
> <option value="2">New York
> </select>
> &nbsp; &nbsp;
> <b>To :</b>
> <select name="Sel2">
> <option value="">
> <option value="1">Chicago
> <option value="2">New York
> </select>
> </form>
> </body>
> </html>
>
>
>



 
Reply With Quote
 
McKirahan
Guest
Posts: n/a
 
      11-01-2004
"Simon Templar" <(E-Mail Removed)> wrote in message
news:(E-Mail Removed)...
> This code works fine. The only problem appears when the user changes their
> selection. The second listbox does not show the hidden option back. I will
> try to improve that.
>
> Thanks!


[snip]

Try this; watch for word-wrap.

<html>
<head>
<title>selnodups.htm</title>
<script type="text/javascript">
function selects(what) {
var form = document.forms[0];
var opts = new Array;
opts[0] = "";
opts[1] = "Chicago";
opts[2] = "New York";
if (what == 0) {
form.Sel1.options.length = 0;
}
form.Sel2.options.length = 0;
for (var i=0; i<opts.length; i++) {
if (what == 0) {
form.Sel1.options[i] = new Option(opts[i], i);
}
form.Sel2.options[i] = new Option(opts[i], i);
}
}
function noDuplicate() {
var form = document.forms[0];
selects(1);
var valu = form.Sel1.options[form.Sel1.selectedIndex].value;
form.Sel2.options[valu] = null;
}
</script>
</head>
<body onload="selects(0)">
<form>
<b>From :</b>
<select name="Sel1" onchange="noDuplicate()">
</select>
&nbsp; &nbsp;
<b>To :</b>
<select name="Sel2">
</select>
</form>
</body>
</html>

This link may help: http://www.quirksmode.org/js/options.html


 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
non-dependent vs. dependent template names puzzlecracker C++ 1 08-07-2008 07:42 AM
Listboxes don't always show Terry D ASP .Net 0 06-15-2004 02:41 PM
ASP.Net Listboxes Big E ASP .Net 1 06-15-2004 11:35 AM
displaying a textboxes vs. listboxes depending on postback condition jason@cyberpine.com ASP .Net 1 11-05-2003 03:52 PM
listboxes......... bill yeager ASP .Net 3 08-11-2003 06:39 PM



Advertisments