Trying to submit a form upon hitting the enter key

jomama · #1 08-18-2004, 02:22 AM

I have a page that displaying multiple records and a couple of the fields in each row are editable. Also each record(row) has a submit button and each row is a seperate form. The page works and each record updates seperately according the button that you click.

Now here is what I want to do:

If the enter key is pressed{

if there is a cursor in a field when the enter key is pressed, then{
submit that form and its data
}
}

That's it. I already have a global listener that checks each key stroke, and within the function, different code is exectued when one of several keys are pressed(or key combinations, i.e. ctrl + d). So I am passed that. What I need now is to figure out in which form the cursor is when the enter key is pressed. There must be a way to check a property of a certain object to find out the name of the form. Or maybe there is a way to make a way to update a javascript global variable evertime a field is clicked(i.e. formname = "form1"), then when a field is changed(onChange="formvalue=''") so that if there is not a cursor in a field, the formname value would be empty and no form would be submitted.

Thanks in advance for all help,
Josu

neil9999 · #2 08-18-2004, 03:13 AM

Can you post the code you are using please.

Neil

**Kor** · #3 08-18-2004, 04:41 AM

But... (at least for IE) when you focus a field, the correspondent submit button is automatically focused also, thus when press Enter, it will fire the correspondent form, so I guess you don't need any extra javascript code...

In Moz, as far as I know, the submit button is not visible focused, but the submit action is fired the same as in IE...

So...do you still need that?

(it can be done using the index order of forms... i.e.: first form is refered as document.forms[0], second is document.forms[1] and so on... Do a loop through the forms and through the forms elements to see which is focused and submit() the correspondent form)

jomama · #4 08-18-2004, 12:35 PM

I only need this to work for IE b/c it is an intranet app. Yes, normally when you cleck inside of a field the submit button is also highlighted, and on other pages in this app it normally does that. But, this page has multiple submit buttons so it is not allowing me to do the same.

You mentioned that I could loop through the form elements to see which form should be submitted. Could you elaborate what objects, methods, etc could be used to do that? Please

Here is the code so far. I also have a onKeyPress="keyPress();" in the body tag and this part works:

function keyPress() {
keyStroke = window.event.keyCode;
if (keyStroke == '13') { //Enter Key

//NOW WHAT DO I DO HERE?
}
}

emblem · #5 08-18-2004, 01:02 PM

function keyPress() {
keyStroke = window.event.keyCode;
if (keyStroke == '13') {

document.FORM-NAME.submit()
}
}
document.onKeyPress = keyPress;

jomama · #6 08-18-2004, 01:30 PM

Thanks for the reply, but I now how to submit a form, what I need to do is figure out which form to submit. There is a form for every record displayed on the page. I need to submit the form that has a cursor in one of its elements(input fields).

Maye there is a way to keep a global variable, that stores the form name, that updates every time a field is clicked. My problem is that I don't know how to identify the form when it is clicked.
]
Mayvbe if I pass function like this?:

onClick="updateFormVar(this.form)"

and the function would be like this:

function updateFormVar(formname){
formNameVar = formName;
}

Would I then be able to use that variable(does it persist between after a function is passed) when an Enter key is pressed?:

function keyPress() {
keyStroke = window.event.keyCode;
if (keyStroke == '13') {
if (formNameVar <> "" ) {
formSubmit = "document." + formNameVar
formSubmit.submit();
}
}
}

Thanks in advance for your help.

emblem · #7 08-18-2004, 08:28 PM

as an example script(that works i tested it)

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>test</title>
<script language="JavaScript" type="text/javascript">
<!--
function UpdateForm(which){
uform = "document."+which
}
function OuT() {
uform = ""
}
function keyPress() {
isNetscape=(document.layers);
keyStroke = eventChooser = (isNetscape) ? keyStroke.which : window.event.keyCode;
if (keyStroke == '13') {

uform.submit()
}
}
document.onKeyPress = keyPress;
//-->
</script>
</head>
<body>
<table border="2">
<tr>
<td>
<form name="coco" onmouseover="UpdateForm(coco)" onmouseout="OuT()" action="#">
<input type="text" name="name1">
</form>
<tr>
</tr>
</tr>
<td>
<form name="popo" onmouseover="UpdateForm(popo)" onmouseout="OuT()" action="#">
<input type="text" name="name2">
</form>
<tr>
</tr>
</tr>
<td>
<form name="nono" onmouseover="UpdateForm(nono)" onmouseout="OuT()" action="#">
<input type="text" name="name3">
</form>
</td>
</tr>
</table>
</body>
</html>

if you need to add more forms add onmouseover="UpdateForm(nono)" onmouseout="OuT()" to the forms and the part in red you change to the
name of the form
exmple:<form name="jojo" onmouseover="UpdateForm(jojo)" onmouseout="OuT()"></form>
and the reason it does not work in IE isa because of this line
keyStroke = window.event.keyCode;
it can be this

Code:

isNetscape=(document.layers);
keyStroke = eventChooser = (isNetscape) ? keyStroke.which : window.event.keyCode;

i changed that above

emblem · #8 09-13-2004, 04:33 PM

i changed my mind that code does not work
i made a bobo
good code is:
[code]<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>test</title>
<script language="JavaScript" type="text/javascript">

</script>
</head>
<body>
<table border="2">
<tr>
<td>
<form name="coco" onmouseover="UpdateForm(coco)" onmouseout="OuT()" action="#">
<input type="text" name="name1">
</form>
<tr>
</tr>
</tr>
<td>
<form name="popo" onmouseover="UpdateForm(popo)" onmouseout="OuT()" action="#">
<input type="text" name="name2">
</form>
<tr>
</tr>
</tr>
<td>
<form name="nono" onmouseover="UpdateForm(nono)" onmouseout="OuT()" action="#">
<input type="text" name="name3">
</form>
</td>
</tr>
</table>
</body>
</html>

sls2000 · #9 06-29-2005, 01:35 PM

// put the following script in your javascript:

function keyPress(keystroke) {
if (keystroke == '13') {
document.formName.submit();
}
}

// put the following script in your body statement:

<body onKeyPress=keyPress(event.keyCode);>

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)