Dependent listboxes

Discussion in 'Javascript' started by Simon Templar, Oct 30, 2004.

  1. 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?
     
    Simon Templar, Oct 30, 2004
    #1
    1. Advertising

  2. Simon Templar

    McKirahan Guest

    "Simon Templar" <> wrote in message
    news:...
    > 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>
     
    McKirahan, Oct 30, 2004
    #2
    1. Advertising

  3. 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" <> escribió en el mensaje
    news:qMSgd.335583$3l3.245825@attbi_s03...
    > "Simon Templar" <> wrote in message
    > news:...
    > > 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>
    >
    >
    >
     
    Simon Templar, Nov 1, 2004
    #3
  4. Simon Templar

    McKirahan Guest

    "Simon Templar" <> wrote in message
    news:...
    > 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 = new Option(opts, i);
    }
    form.Sel2.options = new Option(opts, 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
     
    McKirahan, Nov 1, 2004
    #4
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. bill yeager

    listboxes.........

    bill yeager, Aug 8, 2003, in forum: ASP .Net
    Replies:
    3
    Views:
    660
    Prakash
    Aug 11, 2003
  2. Replies:
    1
    Views:
    303
  3. Big E

    ASP.Net Listboxes

    Big E, Jun 14, 2004, in forum: ASP .Net
    Replies:
    1
    Views:
    355
    John Saunders
    Jun 15, 2004
  4. Terry D

    Listboxes don't always show

    Terry D, Jun 15, 2004, in forum: ASP .Net
    Replies:
    0
    Views:
    323
    Terry D
    Jun 15, 2004
  5. puzzlecracker
    Replies:
    1
    Views:
    546
    James Kanze
    Aug 7, 2008
Loading...

Share This Page