SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    chown linux:users\ /world Hartmann's Avatar
    Join Date
    Aug 2000
    Location
    Houston, TX, USA
    Posts
    6,455
    Mentioned
    11 Post(s)
    Tagged
    0 Thread(s)

    Checkbox hides/shows Textfield

    I am wanting to implement a checkbox that when checked displays a textfield and when unchecked hides the textfield (and erases anything that was in it).

    Is this possible in Javascript (I am assuming that it is) and where are some resources that would help me get started in doing this?

  2. #2
    ☆★☆★ silver trophy vgarcia's Avatar
    Join Date
    Jan 2002
    Location
    in transition
    Posts
    21,235
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    HTML Code:
    <input type="checkbox" name="showfield" onclick="toggle(this, document.getElementById("thefield"));" />
    <input type="text" name="thefield" id="thefield" />
    Code:
    function toggle( cbox, tbox )
    {
      if( cbox.checked )
      {
        tbox.style.display = '';
      }
      else
      {
         tbox.style.display = 'none';
         tbox.value = '';
      }
    }
    
    //hide the text box on page load
    onload = function()
    {
      var tb = document.getElementById( "thefield" );
      tb.style.display = 'none';
    }

  3. #3
    chown linux:users\ /world Hartmann's Avatar
    Join Date
    Aug 2000
    Location
    Houston, TX, USA
    Posts
    6,455
    Mentioned
    11 Post(s)
    Tagged
    0 Thread(s)
    Works like a charm... I am guessing that I can expand this to some text that has an id?

    I want to make the textfield have a message attached to it and have that message appear and disappear on the click as well.

    Thanks Vinnie!

  4. #4
    ☆★☆★ silver trophy vgarcia's Avatar
    Join Date
    Jan 2002
    Location
    in transition
    Posts
    21,235
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by Hartmann
    Works like a charm... I am guessing that I can expand this to some text that has an id?
    Yep. Just don't use the ".value" line, since that's only for text boxes.
    Quote Originally Posted by Hartmann
    I want to make the textfield have a message attached to it and have that message appear and disappear on the click as well.
    In that case, wrap your text and the input box in a div and make the div disappear.


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
  •