SitePoint Sponsor

User Tag List

Results 1 to 4 of 4

Thread: Textareas

Hybrid View

  1. #1
    Pedantic Semantic blain's Avatar
    Join Date
    Mar 2006
    Location
    Yorkshire, UK
    Posts
    528
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Textareas

    I have seen it on some peoples contact forms where they have default text in a textarea that disappears when clicked on.
    Any idea how this is done?
    Technology is dominated by two types of people:
    those who understand what they do not manage,
    and those who manage what they do not understand.

  2. #2
    SitePoint Evangelist elgumbo's Avatar
    Join Date
    Nov 2002
    Location
    North West, UK
    Posts
    545
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi

    You can do this using javascript:

    eg:

    Code:
    <script language="javascript" type="text/javascript">
    <!--
    	function clearBox(box) {
    		 if(box.value==box.defaultValue) {
    	 	 	 box.value = "";
    	 	 }
    	 }
    //-->
    </script>
    <form>
    <textarea name="1" cols="3" rows="3" onFocus="clearBox(this);" > default text</textarea>
    </form>

  3. #3
    SitePoint Zealot pixelz's Avatar
    Join Date
    Nov 2006
    Location
    Durban
    Posts
    132
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hey Blain,

    This is pretty straightforward, luckily. It's a simple attribute change.

    So, <input name="myForm" /> will just give you a blank box, but if you add the value attribute like so: <input name="myForm" value="This is my default content" /> should fill in this text in the box.

    For a textarea, it's even simpler - put the value you want to enter in between the <textarea> tags: <textarea>value</textarea>

    Making it dissapear is a little bit more tricky as you will have to listen for an onClick event and then run some javascript to assign a blank value to the box. maybe something like this.

    <input name="myForm" value="This is my default content" onClick="clearValue(this)" />

    function clearValue(boxToClear) {
    myForm.boxToClear.value = "";
    }

    Something like that - I'm not 100% sure of the syntax but that's the basic idea. This will probably work with a textarea too, but you may have to change the innerHTML proerty though.

    HTH!

    Cheers

    Pixelz

  4. #4
    Pedantic Semantic blain's Avatar
    Join Date
    Mar 2006
    Location
    Yorkshire, UK
    Posts
    528
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    cheers guys, it worked.
    Technology is dominated by two types of people:
    those who understand what they do not manage,
    and those who manage what they do not understand.


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
  •