1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

form onBlur trick

Discussion in 'JavaScript' started by Weirfire, Dec 22, 2005.

0
  1. #1
    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! :D

    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 :eek: )
     
    Weirfire, Dec 22, 2005 IP
    Crazy_Rob likes this.
  2. discoverclips

    discoverclips Peon

    Messages:
    491
    Likes Received:
    15
    Best Answers:
    0
    Trophy Points:
    0
    #2
    lol, thank you weirfire for the tip ;)
     
    discoverclips, Dec 22, 2005 IP
  3. aaron_nimocks

    aaron_nimocks Im kind of a big deal Staff

    Messages:
    5,563
    Likes Received:
    627
    Best Answers:
    0
    Trophy Points:
    420
    #3
    Grats to yourself! :)
     
    aaron_nimocks, Dec 22, 2005 IP
  4. Colleen

    Colleen Illustrious Member

    Messages:
    6,777
    Likes Received:
    725
    Best Answers:
    1
    Trophy Points:
    430
    #4
    :eek: :( Glad you found it Stephen and shared. :D
     
    Colleen, Dec 22, 2005 IP
  5. Weirfire

    Weirfire Language Translation Company

    Messages:
    6,979
    Likes Received:
    365
    Best Answers:
    0
    Trophy Points:
    280
    #5
    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?
     
    Weirfire, Dec 22, 2005 IP
  6. Colleen

    Colleen Illustrious Member

    Messages:
    6,777
    Likes Received:
    725
    Best Answers:
    1
    Trophy Points:
    430
    #6
    Awesome, then you should put it up as a tutorial. Just make it another page of your business site. :) Then Google can index it.
     
    Colleen, Dec 22, 2005 IP
  7. Weirfire

    Weirfire Language Translation Company

    Messages:
    6,979
    Likes Received:
    365
    Best Answers:
    0
    Trophy Points:
    280
    #7
    DP will snap it up quicker than you can say juggling.
     
    Weirfire, Dec 22, 2005 IP
  8. Weirfire

    Weirfire Language Translation Company

    Messages:
    6,979
    Likes Received:
    365
    Best Answers:
    0
    Trophy Points:
    280
    #8
    This might be asking a bit much but would there be a way of transferring the first X characters of title to titlecopy?
     
    Weirfire, Dec 22, 2005 IP
  9. Dekker

    Dekker Peon

    Messages:
    4,185
    Likes Received:
    287
    Best Answers:
    0
    Trophy Points:
    0
    #9
    could you export it to a variable and then re-import it?
     
    Dekker, Dec 22, 2005 IP
  10. Weirfire

    Weirfire Language Translation Company

    Messages:
    6,979
    Likes Received:
    365
    Best Answers:
    0
    Trophy Points:
    280
    #10
    This could actually be a possibility... let me try it out. :)
     
    Weirfire, Dec 22, 2005 IP
  11. Weirfire

    Weirfire Language Translation Company

    Messages:
    6,979
    Likes Received:
    365
    Best Answers:
    0
    Trophy Points:
    280
    #11
    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.
     
    Weirfire, Dec 22, 2005 IP
  12. Dekker

    Dekker Peon

    Messages:
    4,185
    Likes Received:
    287
    Best Answers:
    0
    Trophy Points:
    0
    #12
    i think there is, would be inefficient to not
     
    Dekker, Dec 22, 2005 IP
  13. the_pm

    the_pm Peon

    Messages:
    332
    Likes Received:
    33
    Best Answers:
    0
    Trophy Points:
    0
    #13
    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):
     
    the_pm, Dec 22, 2005 IP
    Weirfire and Colleen like this.
  14. Weirfire

    Weirfire Language Translation Company

    Messages:
    6,979
    Likes Received:
    365
    Best Answers:
    0
    Trophy Points:
    280
    #14
    Nice 1 the_pm ... you're getting some green for that. :)

    What about if I wanted the first 20 characters of foo?
     
    Weirfire, Dec 22, 2005 IP
  15. the_pm

    the_pm Peon

    Messages:
    332
    Likes Received:
    33
    Best Answers:
    0
    Trophy Points:
    0
    #15
    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 :) ).
     
    the_pm, Dec 22, 2005 IP
  16. Weirfire

    Weirfire Language Translation Company

    Messages:
    6,979
    Likes Received:
    365
    Best Answers:
    0
    Trophy Points:
    280
    #16
    Thats fantastic the_pm :)
     
    Weirfire, Dec 22, 2005 IP
  17. the_pm

    the_pm Peon

    Messages:
    332
    Likes Received:
    33
    Best Answers:
    0
    Trophy Points:
    0
    #17
    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):
     
    the_pm, Dec 22, 2005 IP
  18. Weirfire

    Weirfire Language Translation Company

    Messages:
    6,979
    Likes Received:
    365
    Best Answers:
    0
    Trophy Points:
    280
    #18

    That is 1 sweet piece of code the_pm. Thanks for that! :)
     
    Weirfire, Dec 23, 2005 IP
  19. the_pm

    the_pm Peon

    Messages:
    332
    Likes Received:
    33
    Best Answers:
    0
    Trophy Points:
    0
    #19
    Sure thing. Always glad to help :)
     
    the_pm, Dec 23, 2005 IP