...

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



lbjvg
12-07-2009, 05:26 AM
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:


<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.



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/javascript/page/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.

Philip M
12-07-2009, 07:28 AM
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. :(



<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.

lbjvg
12-07-2009, 09:52 PM
Thanks Phillip M! Very nice! I will put your example to work. Thank you! - Jim



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum