Click to See Complete Forum and Search --> : Form submit on enter, allow newlines
zaajats
01-02-2005, 12: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">
<!--
function submitenter(myfield,e)
{
var keycode;
if (window.event) keycode = window.event.keyCode;
else if (e) keycode = e.which;
else return true;
if (keycode == 13)
{
document.chat_form.submit();
return false;
}
else
return true;
}
//-->
</script>
...
<textarea onKeyPress="return submitenter(this,event)"> </textarea>
...
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
01-02-2005, 01:23 PM
It's a standard practice in programming to use "\n" for a new line. It might work with real people too.
zaajats
01-02-2005, 03: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.
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>
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
01-03-2005, 06:45 AM
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.
Hello!
Just the basics:<!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
01-03-2005, 07:39 AM
Works like a charm, thanks a lot PJ