Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Dec 2009
    Posts
    9
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Help needed - clearing textarea after 'reset' - ie can onfocus=null be reversed?

    Hi-

    I have a table with numerous textareas that I am able to clear once - the first time the textarea is clicked the default value is cleared and everything is OK.

    However, at a certain point the user might press a 'Clear' button linked to a function I wrote to reset the values back to the defaults. At this point clicking into the textarea does not clear it.

    Below is a typical textarea:

    Code:
    <textarea rows= "2" cols="15" class="Klabel" id="ta5" onfocus="this.value=''; this.onfocus=null; setbg_color('ta5','#EFA746')" onchange="setbg_color('ta5', '#EBF5FF')">
    Type a label
    </textarea>
    Below are the relevant functions.
    The Clear function mentioned above just runs 'setbg_color' and 'set_value' for each textarea and sets them to the defaults.

    Code:
    function setbg_color(id, color){
    	document.getElementById(id).style.background=color;
    }
    function set_value(id, celltype){
    	document.getElementById(id).value=celltype;
    	}
    Is there anyway to essentially reverse the effects of the this.onfocus=null; statement? I tried something like this.onfocus=true; but that didn't work.

    An update - I haven't answered the reversing null question but an acceptable solution is to reload the page from within javascript as per http://www.mediacollege.com/internet...ge/reload.html

    Thanks -Jim

    ps - As part of my research I came across this http://mvied.com/blog/unobtrusive-input-clear-focus/ which does a smoother job of clearing the textareas but does not solve my question.
    Last edited by lbjvg; 12-07-2009 at 06:50 AM. Reason: edit title

  • #2
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,982
    Thanks
    203
    Thanked 2,536 Times in 2,514 Posts
    This should move you forward. Obviously you can change the background color as well. onfocus = null will clear the textbox each time so that the user is unable to revisit the entry to make a correction - he can only retype the input data.

    Code:
    <input type = "text" name = "uname" id = "uname" size = "40" value = "Enter user name here:-"; style=color:'#848484'; 
    onclick = "if (this.value == 'Enter user name here:-') {this.value = '';this.style.color='#000000'}"
    onblur = "if (this.value == '') {this.value = 'Enter user name here:-';this.style.color='#848484'}" /> 
    <br><br>
    
    <input type = "text" name = "email" id = "email" size = "40" value = "Enter email here:-"; style=color:'#848484'; 
    onclick = "if (this.value == 'Enter email here:-') {this.value = '';this.style.color='#000000'}"
    onblur = "if (this.value == '') {this.value = 'Enter email here:-';this.style.color='#848484'}" /> 
    
    <input type = "button" value = "Clear all the textboxes" onclick = "clearAll()">
    
    <script type = "text/javascript">
    function clearAll() {
    document.getElementById("uname").value = "Enter user name here:-" ;
    document.getElementById("uname").style.color='#848484';
    document.getElementById("email").value = "Enter email here:-";
    document.getElementById("email").style.color='#848484';
    }
    
    </script>


    We are sorry that due to a typographical error we referred to Wantage MP Ed Vaisey as 'one of the top sexist MPs'. This should have read 'one of the top sexiest MPs'. Wallingford Herald.
    Last edited by Philip M; 12-07-2009 at 09:10 AM.

  • #3
    New to the CF scene
    Join Date
    Dec 2009
    Posts
    9
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Thanks Phillip M! Very nice! I will put your example to work. Thank you! - Jim


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •