Submit form from textarea with enter key

JavaScript
1

Hi,

I wanted to replace the textfield in the script below to textarea but then the javascript function will stop working. How can I make the textarea works as the textfield when the enter key is pressed ? Please advise. or is there any way i can increase the lines of the textfield?


<script>
function handleEnter(e)
{
   var characterCode;
   if(e && e.which)
   {
      e = e;
      characterCode = e.which;
   }
   else
   {
      e = event;
      characterCode = e.keyCode;
   }

   if(characterCode == 13)
   {
      document.forms["myform"].submit();
      return false;
   }
   else
   {
      return true;
   }
}
 </script>

<form id="myform" action="submit-form.php" method="get">
  <p>Search:
  <input type='textarea' name='query'>
  </p>
  <p>
    <label>
      <input type="submit" name="button" id="button" value="Submit">
    </label>
  </p>
</form>
2

There is no such thing as <input type='textarea'>!

Do you mean a <textarea> element? If so, overriding the Enter key would be a very bad idea, because it would make it difficult or impossible to create a line break in the textarea. It would most likely annoy users, too, since it’s a non-standard behaviour.

If you mean a text field (<input type="text">) then Enter already works as submit. Except in IE, if there’s just one field. The workaround is to add a hidden field (<input type="hidden" value="foo">).

It’s also very odd that you wrap your submit button in a <label>, yet you do not mark up the real label (‘Search:’) as a <label>. :confused:

3

Hi,

actually what i want is to show more than one line from the text field and i dont really care about the line break.,… anyway i can make this enter key to submit form happen ?

4

But if users can’t input a line break, there won’t be more than one line in the textarea (a text field is single-line). :confused:

If you really want to do this, you’ll need to add a keyboard event handler for the textarea, check for Enter keys and call the form’s submit() method. Exactly how to do this varies somewhat between browsers, unfortunately.

5

but i can see they liveperson chat is using the same code to accomplish this. Anyone know how they did that ?

6

I don’t know what a ‘they liveperson chat’ is, so I can’t help there. Sorry.