Forum Moderators: open
Any examples of how to do this out there? Or can someone at least point me in the right direction.
Thanks!
I have just posted the basic functionality you wanted in your FORM but you can change the message, look and feel according to your requirements.
you may also find this of interest.;)
All that is required of you is that you add inputs and information to match. ;)
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>input information</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
#div1,#div2 {
width:200px;
float:left;
}
input,textarea {
margin:8px;
}
-->
</style>
<script type="text/javascript">
<!--
var info=new Array();
info[0]='this is the information for input 0';
info[1]='this is the information for input 1';
info[2]='this is the information for input 2';
info[3]='this is the information for input 3';
var inp=document.getElementsByTagName('input');
function getInfo() {
for(c=0;c<inp.length;c++) {
inp[c].id='inp_'+c;
inp[c].onfocus=function() {
showInfo(this.id,this);
}
}
}
function showInfo(id,obj) {
id=id.split('_');
num=id[1];
document.getElementById('info_display').value=info[num];
obj.onblur=function() {
document.getElementById('info_display').value='';
}
}
onload=getInfo;
//-->
</script>
</head>
<body>
<form action="#">
<div id="div1">
<input type="text">
<input type="text">
<input type="text">
<input type="text">
</div>
<div id="div2">
<textarea id="info_display" rows="5" cols="30"></textarea>
</div>
</form>
</body>
</html>
birdbrain
However, I just had one question. How do I set a default instruction? in other words if the user hasn't clicked on any text boxes I still want it to say something. I tried this:
<script type="text/javascript">
<!--
msg.innerHTML = 'Default text';
//-->
</script>
This is giving a error message and not working. Also, are there any problems with having this outside of the <head> part of the page?
depending on which method you choose, either put the default message between the span tags or the textarea tags.. ;)
birdbrain
you would not have had that problem with my script. ;)
instead of...
<input type="text" name="name" size="20"
onfocus="msg.innerHTML='Please write your name here.'"
onblur="msg.innerHTML=''">
...use...
<input type="text" name="name" size="20"
onfocus="document.getElementById('msg').innerHTML='Please write your name here.'"
onblur="document.getElementById('msg').innerHTML=''">
birdbrain
How do I set a default instruction?
<form method="POST" name="test">
<span id="msg">Help Area</span> <br>
<input type="text" name="name" size="20" onfocus="msg.innerHTML='Please write your name here.'" onblur="msg.innerHTML='Help Area'">
<br>
<input type="submit" value="Submit">
</form>
EDIT: You can use birdbrain's suggestion for document.getElementById