SitePoint Sponsor

User Tag List

Results 1 to 6 of 6
  1. #1
    SitePoint Guru
    Join Date
    Jan 2005
    Location
    USA
    Posts
    633
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    How to open a dynamic text box

    Hi Everyone

    Please help me with a Javascript option box.

    What I have is a question, "how did you hear about us" and a list of options as shown below.What I actually need is when the visitor selects the other option then another textbox will dynamically open below that with a label
    "Please let us know who referred you to us" and a text box for the visitor to add in maybe a persons name or other means how he heard about us.

    I only want this to display when the other option is selected and not when an option like search engine is selected.

    Please let me have an idea where I can start.

    Thanks
    Didi

    <option VALUE="Internet advertising">Internet advertising</option>
    <option VALUE="Search engine">Search engine</option>
    <option VALUE="Newsgroups/ Classifieds">Newsgroups/ Classifieds</option>
    <option vALUE="Newspaper">Newspaper</option>
    <option vALUE="Magazine">Magazine</option>
    <option VALUE="Fax">Fax</option>
    <option VALUE="Email">Email</option>
    <option VALUE="Avertising Board">Avertising Board</option>
    <option VALUE="Flyer/ Business card">Flyer/ Business card</option>
    <option VALUE="Word of Mouth">Word of Mouth</option>
    <option VALUE="Other">Other</option>

  2. #2
    SitePoint Wizard
    Join Date
    Nov 2004
    Location
    Portsmouth UK
    Posts
    1,499
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    one solution

    PHP Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
        "http://www.w3.org/TR/html4/strict.dtd"
    >

    <
    html>

    <
    head>
      <
    title></title>
    <
    script language="JavaScript" type="text/javascript">
    <!--
    function 
    Check(obj){
     if (
    obj.selectedIndex==3){
      
    document.getElementById('other').style.display='block';
     }
    }
    //-->
    </script>
    </head>

    <body>
    <table width="200" cellpadding="0" cellspacing="0" border="1" style="text-align:center;" >
      <tr>
        <td>
        <select name="" size="1" onchange="javascript:Check(this);">
        <option>How did you find this</option>
        <option>Web</option>
        <option>Search</option>
        <option>Other</option>
        </select>
        </td>
      </tr>
      <tr height="100" id="other" style="position:relative;display:none;" >
        <td>
        Put any thing you want in here
        <input type="button" name="" value="Close" onclick="javascript:document.getElementById('other').style.display='none';" >
        </td>
      </tr>
    </table>
    </body>

    </html> 

  3. #3
    SitePoint Guru
    Join Date
    Jan 2005
    Location
    USA
    Posts
    633
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    HI

    It is definately a start for me.

    I am actaully looking for something like that one here

    Go to the vehicle details section at the bottom and see what happens when you select a year

    But what has been given is a good start.

    Thanks,
    Didi

  4. #4
    SitePoint Wizard
    Join Date
    Nov 2004
    Location
    Portsmouth UK
    Posts
    1,499
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Your link seems to take along time doing a trivial task.

    Anyway whatever you find best

  5. #5
    SitePoint Wizard gRoberts's Avatar
    Join Date
    Oct 2004
    Location
    Birtley, UK
    Posts
    2,439
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    ok... for starters thats done via asp.net basically when the page submits it sends the value of the year, then it will have a script that says, if the year has been selected, display this, else dont display it.

    you can try:

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
    <head>
    <title>Untitled Document</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <script language="JavaScript" type="text/javascript">
    function displayOther(){
    if (document.form.ref.options[document.form.ref.selectedIndex].value == 'other'){
    showOther.innerHTML = '<br>Please enter how you found us:<br><input name=\"other\" type=\"text\" id=\"other\">';
    return true;
    }
    else
    {
    return false;
    }
    }
    </script>
    </head>
    
    <body>
    <form name="form" method="post" action="">
      <select name="ref" onChange="displayOther();">
        <option selected>Where did you find us</option>
        <option value="google">Google</option>
        <option value="other">other</option>
      </select>
    <span id=showOther></span>
    </form>
    
    </body>
    </html>
    Create a page with the code above, and then run.

    Worked fine for me... just need to integrate it into your own page, just add the <span id="showOther"></span> underneath your select box, and it will work. Just change the details to match your settings.

    Gav

  6. #6
    SitePoint Guru
    Join Date
    Jan 2005
    Location
    USA
    Posts
    633
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks everyone

    I tested it and it works excellently

    Once again thanks for all the help

    Didi


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
  •