Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to make "Enter" key in a textarea submit a form

Tags:

html

forms

I have a chat that uses textarea instead of text for obvious reasons. This is why each time members hit ENTER they get a new line instead of sending the message. I would like to change this, so every time they hit ENTER =the message to be submitted and then the cursor to return on textarea for their next message typing. I've tried different codes found on this site, most didnt work and those who seemed to do something were just refreshing the page and i got a blank page.

My code:

<form name="message" action="">     <textarea name="usermsg" autocomplete="off" type="text" id="usermsg" rows="4" cols="30" style="width: 450px; margin-left: 25px;">     </textarea>     <br/>      <p style="margin-left: 420px;"><input name="submitmsg" type="submit"  id="submitmsg" value="Send" /></p> </form> 

Thank you very much for your time.

like image 356
Ingrid Avatar asked Jan 19 '12 22:01

Ingrid


People also ask

How do I submit using Enter key?

To submit the form using 'Enter' button, we will use jQuery keypress() method and to check the 'Enter' button is pressed or not, we will use 'Enter' button key code value. Explanation: We use the jQuery event. which to check the keycode on the keypress.

How submit form with Enter key react?

To submit a form using the Enter key in React: Add a button element with type set to submit . Add an onSubmit prop that points to a submit handler function. Every time the user presses Enter, the handle submit function will be invoked.

Can textarea be used in form?

The <textarea> tag defines a multi-line text input control. The <textarea> element is often used in a form, to collect user inputs like comments or reviews. A text area can hold an unlimited number of characters, and the text renders in a fixed-width font (usually Courier).

What is textarea form element used for How does the user enter data?

The HTML textarea tag is used to make a text input field with multiple lines in a form. It is defined with the <textarea> tag and can hold an unlimited number of characters.


1 Answers

Try this (note that pressing Enter submits, and Shift+Enter adds a new line).

$("#textareaId").keypress(function (e) {     if(e.which === 13 && !e.shiftKey) {         e.preventDefault();              $(this).closest("form").submit();     } }); 
like image 80
Sergio Cabral Avatar answered Oct 02 '22 12:10

Sergio Cabral