SitePoint Sponsor

User Tag List

Results 1 to 3 of 3

Thread: )k;

  1. #1
    SitePoint Addict jamesbond's Avatar
    Join Date
    Feb 2001
    Location
    The Netherlands
    Posts
    256
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    2 select boxes

    I'm trying to do the following.

    I have 2 select boxes in 1 form.
    The 2nd select box is populated based on the selection made in the 1st select box.
    I have things working almost.

    The only problem is that when the 'default' 2nd select (in this case 'dogs') list consists of 3 items, then the 2nd select list will not show more than 3 options even if there are 4 or more in the list.
    you could try this code and select 'birds' and you'll know what I mean.

    Maybe using document.write to write out the 2nd select box is better, unfortunately I'm not a javascript expert.
    I've been playing with this for hours and I just can't get it to work, so help is greatly appreciated

    <html>
    <head>
    <title>Thau's JavaScript Tutorial</title>
    <script language = "JavaScript">
    <!-- hide me
    function swapOptions(the_array_name) {
    var numbers_select = document.the_form.the_examples;
    setOptionText(numbers_select, the_array_name);
    }

    function setOptionText(the_select, the_array) {
    var dogs = new Array("poodle","puli","greyhound");
    var fish = new Array("trout", "mackerel", "bass");
    var birds = new Array("robin", "hummingbird", "hawk" , "crow","crow2");
    var the_array = eval(the_array);
    for (loop = 0;loop < the_select.options.length; loop++) {
    the_select.options[loop].text = the_array[loop];
    the_select.options[loop].value = the_array[loop];
    }
    }
    // show me -->
    </script>
    </head>
    <body bgColor="#FFFFFF"
    text="#000000" link="#3366CC"
    vLink="#9966CC" aLink="#FF0000" marginWidth="0"
    marginHeight="0" topmargin="0"
    leftMargin="0">
    <p align="center">
    <b>My favorite animal is ...</b>
    <form name="the_form">
    <select name="choose_category"
    onchange="swapOptions(this.options[this.selectedIndex].value);">
    <option selected value="dogs">dogs</option>
    <option value="fish">fish</option>
    <option value="birds">birds</option>
    </select>
    <select name="the_examples">
    <option value="poodle">poodle</option>
    <option value="puli">puli</option>
    <option value="greyhound">greyhound</option>
    </select>
    </form>
    <p>
    </body>
    </html>
    Last edited by jamesbond; Apr 16, 2002 at 14:29.

  2. #2
    SitePoint Member
    Join Date
    Apr 2002
    Posts
    7
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi,

    here is where I found a great article about this subject....

    http://www.webreference.com/js/tips/020112.html


    regards,
    esv.

  3. #3
    Currently Occupied; Till Sunda Andrew-J2000's Avatar
    Join Date
    Aug 2001
    Location
    London
    Posts
    2,475
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    it's here as well grassblade


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •