I'm looking for the piece of code so that when you type into a text input box and then click out of it, another box fills with the same value. I saw this on a tutorial a few days ago but I can't find it again. Anyone got any ideas how I would do this? You might want to try something like the following Weirfire; <form name='formname'> <input type='text' name='title'> <input type='text' name='titlecopy' onFocus="value=this.document.formname.title.value"> </form> Code (markup): Weirfire, you are a genious! You know, instead of putting onFocus="value=this.document.formname.title.value" in the second text box you could put onBlur="this.document.formname.titlecopy.value=this.document.formname.title.value" in the first text box. (I won't bother replying to myself as I felt the first time it was sad enough )
lol thanks. I had to figure it all out myself this time as there is nothing on copying input boxes automatically in any tutorials. Don't you hate it when no-one has put the tutorial you need on the net?
Awesome, then you should put it up as a tutorial. Just make it another page of your business site. Then Google can index it.
This might be asking a bit much but would there be a way of transferring the first X characters of title to titlecopy?
My javascript is a little rusty, but I reckon you could do it if there is a function in javascript to take the first X characters of a variable.
Just for kicks, in case you want a version of this that's XHTML compliant (XHTML doesn't recognize the name attribute for the <form> element): <p><textarea rows="5" cols="35" id="foo" onblur="document.getElementById('bar').value=document.getElementById('foo').value"></textarea></p> <p><textarea rows="5" cols="35" id="bar"></textarea></p> Code (markup):
Nice 1 the_pm ... you're getting some green for that. What about if I wanted the first 20 characters of foo?
You can check for length and call in everything previous to that number. I'll post back in a short while with the actual code (I'm in a client chat at the moment ).
Here ya go. Copy/paste this into a new HTML document and you'll see how everything works <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> <title>Neat Little Script</title> <script type="text/javascript"> function copyme() { var a = document.getElementById('foo').value var b = document.getElementById('blah').value alert("Your total character count is " + a.length + "."); if (document.getElementById('blah').value == "") { b = 0; document.getElementById('blah').value= "0"; } else { document.getElementById('bar').value = a.substring(0,b); } } </script> </head> <body> <p><textarea rows="5" cols="35" id="foo"></textarea></p> <p>How many characters would you like to copy?<br /><input type="text" size="3" id="blah" /></p> <p><textarea rows="5" cols="35" id="bar" readonly="readonly"></textarea></p> <p><input type="button" onclick="copyme()" value="check and copy" /></p> </body> </html> Code (markup):