SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Zealot
    Join Date
    May 2005
    Posts
    100
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Two drop down menu's one hidden, appears if right option is selected

    I have a html form with two drop down menu's. Now what i need is if some one selects a certain option in the first drop down menu then it will show the second one, Otherwise it stays hidden.

    If any one could help i would be really greatful.

    Thanks

  2. #2
    SitePoint Enthusiast
    Join Date
    Aug 2004
    Location
    FL
    Posts
    72
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Here's the way i've been doing it, completely cross-browser compliant:

    Select #1 (the visible one)
    Code:
    <select id="="select_one" name="select_one" onChange="selectChange(this.value);">
            <option value="value1">Select This</option>
            <option value="value2">Select This to Activate Select #2</option>
    </select>
    
    
    <select id="select_two" name="select_two" style="display: none;" disabled>
            <option value="value1">Select This</option>
            <option value="value2">Select This</option>
    </select>
    And the javascript:
    Code:
    function selectChange(value) {
    if (value == "value2") {
      Element.show('select_two'); return false
      $('select_two').disabled == false;
    } else {
      Element.hide('select_two'); return false
      $('select_two').disabled == true;
    }
    }
    As you see, just set the option you want to be the activator of 2nd select menu in the javacript where is says: "value == "value2" to whatever value you want to trigger the 2nd select on. Prototype/Scriptaculous javascript framework is required for this.

    Good Luck.
    Eric A.
    Founder and CEO, XMG Networks, Inc.
    XMG Services: Web 2.0 Photo Management and Sharing | Web Hosting
    Personal Blog: From Two 2 Twelve

  3. #3
    SitePoint Zealot
    Join Date
    May 2005
    Posts
    100
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Works perfectly Thanks


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
  •