Extra newline added in textarea while doing ENTER key detection

I have been trying to detect Enter key in a textarea, and then populating a div. It is working as expected, however, there's a minor quirk wherein the textarea has an extra newline (ENTER) when I try to submit the data.

My intention is to ask the user to add some text and press Enter key. When the enter key is pressed, I perform some action on it and then nullify the textarea. The textarea is getting nullified, but an extra Enter(newline) remains. I have not been able to figure out how to remove that extra newline.

The ready to use HTML code is below:
<html>
<head><title>Test Page</title></head>
<body>

<script>
function chkenter(evn) {

var enterpressed = false;

if (window.event && window.event.keyCode == 13) { // For Internet Explorer
enterpressed = true;
	}
else if (evn && (evn.keyCode == 13 || evn.which == 13 )) { // For Firefox
enterpressed = true;
	}

if (enterpressed) { 
	var textarea = document.getElementById("a1");
	document.getElementById("knock").innerHTML = textarea.value;
	textarea.value="";
	}

}
</script>

<form name=f1>

<textarea id=a1 rows=10 cols=50 onkeypress="chkenter(event)"></textarea>

</form>

<hr>
<div id=knock></div>

</body>
</html>

Open in new window

technotabletAsked:
Who is Participating?
 
InsoftserviceConnect With a Mentor Commented:
Hi,
it works in both ie and firefox.
0
 
Gurvinder Pal SinghCommented:
try this

<html>
<head><title>Test Page</title></head>
<body>

<script>
function chkenter(evn) {

var enterpressed = false;

if (window.event && window.event.keyCode == 13) { // For Internet Explorer
enterpressed = true;
        }
else if (evn && (evn.keyCode == 13 || evn.which == 13 )) { // For Firefox
enterpressed = true;
        }

if (enterpressed) { 
        var textarea = document.getElementById("a1");
        document.getElementById("knock").innerHTML = textarea.value;
		//textarea.value = textarea.value.substring(textarea.value.length -2 );
        textarea.value="";
        }

}

function clearThis( obj, event )
{
if (window.event && window.event.keyCode == 13) { // For Internet Explorer
enterpressed = true;
        }
else if (evn && (evn.keyCode == 13 || evn.which == 13 )) { // For Firefox
enterpressed = true;
        }

if (enterpressed) { 
        var textarea = document.getElementById("a1");
        textarea.value="";
        }
}

</script>

<form name=f1>

<textarea id=a1 rows=10 cols=50 onkeypress="chkenter(event);" onkeyup="clearThis(this, event)"></textarea>

</form>

<hr>
<div id=knock></div>

</body>
</html>

Open in new window

0
 
technotabletAuthor Commented:
Thanks, there's an improvement in IE. The cursor jumps back to the beginning. But doesn't work in Firefox.
0
Cloud Class® Course: Microsoft Exchange Server

The MCTS: Microsoft Exchange Server 2010 certification validates your skills in supporting the maintenance and administration of the Exchange servers in an enterprise environment. Learn everything you need to know with this course.

 
InsoftserviceCommented:
hi,

check out this code

<html>
<head><title>Test Page</title></head>
<body>

<script>

function PressEnter(myfield,e,callback)
      {
      var keycode;
      if (window.event) keycode = window.event.keyCode;
      else if (e) keycode = e.which;
      else return true;

      if (keycode == 13)
         {
         if (callback) {
              eval(callback);
         }
        
         return false;
         }
      else
         return true;
      }
      
function text() {
        var textarea = document.getElementById("a1");
        document.getElementById("knock").innerHTML = textarea.value;
        textarea.value="";
        }

</script>

<form name=f1>

<textarea id="a1" rows=10 cols=50 onKeyPress="return PressEnter(this,event,'text()');"></textarea>

</form>

<hr>
<div id=knock></div>

</body>
</html>
0
 
InsoftserviceCommented:
hi,

Just save it as .html and test it

text() is ur function to copy text from textarea to ur div
0
 
technotabletAuthor Commented:
I didn't imagine I'd get responses so fast. Thank you. It worked the way I wanted it! :-)
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.