SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Wizard Zaggs's Avatar
    Join Date
    Feb 2005
    Posts
    1,051
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Need help with onChange

    Hi Guys,

    I have a select box. Now when the user selects a certain option from the select box I want another select box to appear below. I realise that I must use hidden <div> to achieve this. What I am unable to do is write the onChange event handler.

    When the user selects option 2 from the dropdown below, how can I make the other dropdown appear?

    HTML Code:
    <select name="update_type">
    			    <optgroup label="Number">
                      <option value="1" selected>One</option>
                      <option value="2">Two</option>
                      <option value="3">Three</option>
    				</optgroup>
                  </select>

  2. #2
    SitePoint Wizard
    Join Date
    Oct 2005
    Location
    London
    Posts
    1,678
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Something like this (but inline event handlers as i've used are not best practice)

    Code HTML4Strict:
    <select name="update_type" onchange="createSelect();">
    			    <optgroup label="Number">
                      <option value="1" selected>One</option>
                      <option value="2">Two</option>
                      <option value="3">Three</option>
    				</optgroup>
                  </select>

    And then a javascript function that does something like:

    Code JavaScript:
    function createSelect() {
    var select = document.createElement('select');
    //or grab your hidden div with the next select in it and set it's display to block
    }

  3. #3
    SitePoint Enthusiast
    Join Date
    Aug 2008
    Posts
    44
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Zaggs View Post
    Hi Guys,

    I have a select box. Now when the user selects a certain option from the select box I want another select box to appear below. I realise that I must use hidden <div> to achieve this. What I am unable to do is write the onChange event handler.
    http://www.felgall.com/jstip22.htm


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
  •