?
Solved

Change text when typing into field

Posted on 2016-10-28
2
Medium Priority
?
64 Views
Last Modified: 2016-10-28
I need to have text update as the user types into a field.  There's a working example here...

http://jsbin.com/axibuw/1/edit?html,js,output

But it's not working from my page here.

http://testregister.cenational.org/test/sig4.php

Here's the main page code.
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.0.min.js"></script>
<link href="../support/style.css" rel="stylesheet" type="text/css">
<script type="script/javascript">
  $('.chatinput').keyup(function(event) {
    newText = event.target.value;
    $('.printchatbox').text(newText);
  });
</script>

</head>
<body>

  <div class='printchatbox'>CHANGE ME</div>
  <input type='text' name='fname' class='chatinput'>
</body>
</html>

Open in new window


Here's the CSS
.printchatbox 
    {border-width:thick 10px;border-style: solid; 
    background-color:#fff;
    line-height: 2;color:#6E6A6B;font-size: 14pt;text-align:left;float: middle;
    border: 3px solid #969293;width:40%;
	}

Open in new window


There must be something simple  I'm missing. Thanks in advance for any help.

Steve
0
Comment
Question by:stkoontz
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
2 Comments
 
LVL 20

Accepted Solution

by:
Daniel Van Der Werken earned 2000 total points
ID: 41864454
You have "script/javascript" and it should be "text/javascript":
<!DOCTYPE html>
<html>
	<head>
		<title>
			JQuery Test Host
		</title>
		<script type="text/javascript" src=".\jquery-3.1.1.min.js"></script>
		<!--<script src="http://code.jquery.com/jquery-1.9.0.min.js"></script>-->
		<style>
			.printchatbox 
				{
					border-width:thick 10px;border-style: solid; 
					background-color:#fff;
					line-height: 2;color:#6E6A6B;font-size: 14pt;text-align:left;float: middle;
					border: 3px solid #969293;width:40%;
				}
		</style>
		<script type="text/javascript">
			$(document).ready(function() {
				$('.chatinput').keyup(function(event) {
				  newText = event.target.value;
				  $('.printchatbox').text(newText);
				});  
			  });
		</script>		
	</head>
	<body>
		<div class='printchatbox'>CHANGE ME</div>
		<input type='text' name='fname' class='chatinput'>
	</body>
</html>

Open in new window

0
 
LVL 2

Author Closing Comment

by:stkoontz
ID: 41864483
That was the little think I missed.  Thanks!

Steve
0

Featured Post

On Demand Webinar: Networking for the Cloud Era

Did you know SD-WANs can improve network connectivity? Check out this webinar to learn how an SD-WAN simplified, one-click tool can help you migrate and manage data in the cloud.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

The task A number given should be formatted for easy reading by separating digits into triads. Format must be made inline via JavaScript, i.e., frameworks / functions are not welcome. So let’s take a number like this “12345678.91¿ and format i…
This article will give core knowledge of JavaScript and will head in to your first JavaScript program. I am Durvesh Naik and I am here to deal with this series of JavaScript. I will teach you JavaScript in part wise , as its quite boring to read big…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses

770 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question