Making Form Elements Appear and Disappear

Discussion in 'Javascript' started by Hal Vaughan, Dec 24, 2003.

  1. Hal Vaughan

    Hal Vaughan Guest

    I have a case where the user can select several choices from my 1st <SELECT>
    element. The user's choice on the 1st <SELECT> effects what the possible
    choices are for the 2nd element. Currently the 2nd element is a <TEXT>
    input, but I'd like to be able to make it a <TEXT> element when certain
    items are selected from the 1st <SELECT> and a <SELECT> when other choices
    are selected. Is there a way to either change an element from <TEXT> to
    <SELECT> (and back), or to make a <SELECT> or <TEXT> element disappear
    without re-writing the entire page?

    Thanks!

    Hal
     
    Hal Vaughan, Dec 24, 2003
    #1
    1. Advertising

  2. Hal Vaughan wrote:

    > I have a case where the user can select several choices from my 1st <SELECT>
    > element. The user's choice on the 1st <SELECT> effects what the possible
    > choices are for the 2nd element. Currently the 2nd element is a <TEXT>
    > input, but I'd like to be able to make it a <TEXT> element when certain
    > items are selected from the 1st <SELECT> and a <SELECT> when other choices
    > are selected. Is there a way to either change an element from <TEXT> to
    > <SELECT> (and back), or to make a <SELECT> or <TEXT> element disappear
    > without re-writing the entire page?


    It doesn't depend on the type of the element, if you have a reference to
    an element in the HTML page and if the browser like Netscape 6+, IE4+,
    Opera 7 supports toggling the CSS display property of an element then
    you can do
    if (element.style) {
    element.style.display = 'none';
    }
    to hide the element and
    if (element.style) {
    element.style.display = '';
    }
    to show it again.
    If you are scripting form controls inside a <form> container then the
    usual way to access another control element object is alike
    <form ...>
    ...
    <select name="select0"
    onchange="if (this.selectedIndex == 3) {
    var element = this.form.elements.select1;
    if (element.style) {
    element.style.display = 'none';
    }
    }">
    ...
    </select>
    ...
    <select name="select1" ...>
    if (this.s

    --

    Martin Honnen
    http://JavaScript.FAQTs.com/
     
    Martin Honnen, Dec 25, 2003
    #2
    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. Tamir Kamara
    Replies:
    1
    Views:
    402
    Alvin Bruney [MVP]
    Feb 29, 2004
  2. Claus Tondering

    Tkinter: Making a window disappear

    Claus Tondering, Oct 9, 2006, in forum: Python
    Replies:
    4
    Views:
    589
    Eric Brunel
    Oct 10, 2006
  3. ZigZag Life

    making a div id disappear

    ZigZag Life, Aug 12, 2009, in forum: HTML
    Replies:
    4
    Views:
    540
    ZigZag Life
    Aug 13, 2009
  4. Howard Jess

    Form images don't appear in form.elements

    Howard Jess, Oct 18, 2004, in forum: Javascript
    Replies:
    1
    Views:
    156
    Richard Cornford
    Oct 18, 2004
  5. Larz
    Replies:
    5
    Views:
    474
    David Mark
    May 26, 2009
Loading...

Share This Page