Form submit on enter, allow newlines

zaajats · #1 01-02-2005, 01:10 PM

Hi,

I have a form with one <textarea> field that submits the form when the user presses "enter". But I would like that users could enter newlines by pressing ctrl+enter, shift+enter or some similar combination.

Is that possible, and if it is, then how can I do it?

The current code is the following:

...
<script type="text/javascript">

</script>
...
<textarea onKeyPress="return submitenter(this,event)"> </textarea>
...

pj59 · #2 01-02-2005, 01:37 PM

Hello!

From my point of view, your approach is not logical. You avoid the normal "newline" in a form field and have the form submitted on pressing enter. Wouldn't it be much more practical to leave the textarea's functionality untouched and provide an "as-easy-as-possible" way for the user to submit the form without using his mouse?

You would have to tell the user how to do that, just like you would if the new line required something "special".

PJ

Charles · #3 01-02-2005, 02:23 PM

It's a standard practice in programming to use "\n" for a new line. It might work with real people too.

zaajats · #4 01-02-2005, 04:47 PM

The code is for an instant messenger type application, where it would be convenient for the user to use [enter] to send the message.
But in, for example MSN messenger, I often use line breaks (ctrl+enter) to make my text clearer, so I thought this would be a useful function.

**Kor** · #5 01-03-2005, 06:03 AM

try:

using also onkeydown/onkeyup events to modify a parameter in case SHIFT or CTRL is pressed/released. Use this parameter as a condition to not submit/submit form when Enter is pressed.

something like:

var param;
function checkE(e){
if(SHIFT or CTRL is pressed)
param = 1;
if(SHIFT or CTRL is released)
param = 0;
}

function submitenter(myfield,e)
if(param==0){
... now the rest of your code...

...

<textarea onKeyPress="return submitenter(this,event)" onkeydown="checkE(event)" onkeyup="checkE(event)"> </textarea>

pj59 · #6 01-03-2005, 06:45 AM

I would not use ctrl+enter for the line breaks. Both Mozilla and IE wouldn't deal with it. Opera does so (depending on version and settings).

Shift+enter would be better due to that. If you like, I can make a little script which does what you want.

PJ

zaajats · #7 01-03-2005, 07:45 AM

Quote:

Originally posted by pj59
I would not use ctrl+enter for the line breaks. Both Mozilla and IE wouldn't deal with it. Opera does so (depending on version and settings).
Shift+enter would be better due to that. If you like, I can make a little script which does what you want.

pj59,
I would really appreciate if you wrote the script, I am not really an expert in javascript.

Thanks in advance.

pj59 · #8 01-03-2005, 08:11 AM

Hello!

Just the basics:

PHP Code:


			
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<title>Untitled</title>

<script language="JavaScript" type="text/javascript">

<!--

var isShift=null;

var isNN = (navigator.appName.indexOf("Netscape")!=-1);

var OP = (navigator.appName.indexOf("Opera")!=-1);

if(OP)isNN=true;

var key;

function shift(event){

key = (isNN) ? event.which : event.keyCode;

if (key==16)isShift=1;

}

function process(event){

key = (isNN) ? event.which : event.keyCode;

if(document.layers&&event.modifiers==4){

isShift=1;

}

if (key==13&&isShift!=1){

document.myForm.submit();

}

if (key!=16)isShift=null;

}

function retrieve(){

document.myForm.text1.focus();

if(location.search.length>0){

blubb=unescape(location.search.split('=')[1]);

document.myForm2.text2.value=blubb;

}

}

//-->

</script>

</head>

<body onload="retrieve()">

<form name="myForm">

<textarea name="text1" onkeypress="process(event)" onkeydown="shift(event)" cols="50" rows="7"></textarea><input type="submit" accesskey="s" value="Send">

</form><br><br>

This second textarea is just to show, that the line breaks "arrive":<br>

<form name="myForm2">

<textarea name="text2" cols="50" rows="7"></textarea>

</form>

</body>

</html>

Tested in Opera (5.02 and 6.05), Netscape (4.7, 6.2.2 and 7.02), Mozilla 1.5 and IE 6.

Apart from the focussing of the upper textarea, the function retrieve and its' call in the body tag are just for playing, just like the second form with the lower text area.

Regards PJ

zaajats · #9 01-03-2005, 08:39 AM

Works like a charm, thanks a lot PJ

pj59 · #10 01-03-2005, 08:40 AM

You're welcome!

PJ

Coruba67 · #11 02-21-2009, 02:42 AM

Hi guys, I know this thread has been dead for a while now, its just I went through it with the same issue, however my browser is reporting that

"The object doesn't support this property or method"

referring to the part in the javascript

document.sendmessage.submit();

sendmessage being the name of my form. Any idea's what gives?

Thread Tools	Search this Thread
Show Printable Version Email this Page	Search this Thread: Advanced Search
Display Modes	Rate This Thread
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode	Rate This Thread:

Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)