[SOLVED] Enter key to trigger submit

[ober]

Alright, so I'm using the code below to trap the enter key to submit a shoutbox entry. However, it's submitting the enter key as part of the text. Can someone tell me how to cut that off?

 

function checkSubmit(e) {
var characterCode

if(e && e.which){
    e = e
    characterCode = e.which 
}
else{
    e = event
    characterCode = e.keyCode
}

if(characterCode == 13){ 
    sendChat()
    return false 
}
else{
     return true 
           }
}

 

<textarea cols="80" rows="4" name="chatInput" id="chatInput" onKeyDown="checkSubmit(event);"></textarea>

[ober]

I should clarify that... it's submitting the return as a newline which then gets displayed in the shoutbox.  Display is done with PHP/AJAX.  I want it to stop submitting the newline character.

[tomfmason]

This is how I do it..

 

window.onload = function () {
   var div = document.getElementById('Div');
   div.onkeydown = function (e) {
        if (!e) {e = window.event};
        if (e.keyCode == 13) {
            sendChat();
            return false;
        }
   }
}

 

I have tested this in FF, IE6 + 7, Opera and Netscape..

 

edit

 

If you try that and are still getting the newline, try this...

 

function blockSubmit() {
    sendChat();
    return false;
}

window.onload = function () {
   var div = document.getElementById('Div');
   div.onkeydown = function (e) {
        if (!e) {e = window.event};
        if (e.keyCode == 13) {return blockSubmit()};
   }
}

 

Tom

[ober]

I'm not sure how that would help... I'm using the text area to collect the info... and I'm not doing anything with the div except for displaying stuff back from PHP. 

 

Maybe I should be asking how to strip a trailing newline with PHP?

[fenway]

I don't see any cancelling of event bubbling.

[ober]

I'm not sure what you mean... I'm not trying to cancel the event.  I just want it so that when someone presses the enter key, it doesn't put the newline into the entry but it submits what's currently in the textarea as an entry.

[artacus]

If you use the onKeyPress event w/ your text field, it will fire BEFORE the nl character is added to your text field, which is what you want.

onKeyUp will fire AFTER the character has been added.

 

That's how it works in Firefox anyhow.

[tomfmason]

I'm not sure how that would help... I'm using the text area to collect the info... and I'm not doing anything with the div except for displaying stuff back from PHP. 

 

Maybe I should be asking how to strip a trailing newline with PHP?

 

Ober, the code above is almost exactly what I have in a working chat app. Let me rewrite this were it will make sense. I was referring to div when I meant textarea..

 

function blockSubmit() {
    sendChat();
    return false;
}

window.onload = function () {
   var txt = document.getElementById('chatInput');
   txt.onkeydown = function (e) {
        if (!e) {e = window.event};
        if (e.keyCode == 13) {return blockSubmit()};
   }
}

 

Remove the event listener from the textarea and test the code above. I would be willing to be that it will solve the problem.

[ober]

I just don't get why you need the "blockSubmit" function when you can put that code inline?  I also don't understand the necessity to use a onload function.

[ober]

Ok, I just changed it to onKeyPress and that fixed the problem.  Thanks!