tbone
tbone

Reputation: 5865

Pressing enter on any textbox invokes my Save button click event?

I have a standard asp.net webform with multiple textboxes (Autopostback=False) on it and a Save button.
Pressing ENTER while in any textbox is causing the server side click event of the Save button to be invoked. If I break and look at the call stack, the click event is the only event listed. I do not have a default button set for the form. If I put another button above the save button, then it gets its click event invoked on any press of enter on a textbox.

Any ideas why this is happening, and how to get it to stop?

Upvotes: 3

Views: 10733

Answers (5)

fabigato
fabigato

Reputation: 11

I had the exact same problem: I had a databound gridview, a textbox and a button. The textbox was used to filter the grid contents, as a search box. The button was used for a totally different action. Before putting the button, hitting the enter key on the textbox caused the grid to be filtered, which was expected behavior. But as soon I put the button, hitting enter while focus on the textbox caused the onclick event of the button to be called. I fixed it just by setting to true the autopostback property of the textbox. I don't understand why, but somehow it overrides the form submission behavior of the textbox. Hope it helps

Upvotes: 1

Brandon
Brandon

Reputation: 69973

This is the default behaviour for most fields except for text areas.

To get around this you can call a javascript function before the form is submitted to check the keypress.

<script type="text/javascript">
  function allowSubmission() {
  return !(window.event && window.event.keyCode == 13); }
</script>

Then the only way to submit the form is to actually hit submit. However as many people have mentioned, the enter key submitting a form is expected behaviour, so you can always alter the function to do basic validation on the fields, allowing the enter key to submit the form if all the required fields have been filled in.

<script type="text/javascript">
  function allowSubmission() {
  return !(window.event && window.event.keyCode == 13) || validateInput(); }
</script>

Edit: You'd call this function on the OnClientClick method of your submit button. Something like:

<asp:Button id="SubmitBtn" runat="server" OnClientClick="return allowSubmission()"/>

Upvotes: 3

David Basarab
David Basarab

Reputation: 73301

Make sure your text boxes are set to Multiline as TextMode, if not enter key is executing a command button causing the post back.

<asp:TextBox ID="TextBox1" runat="server" TextMode="MultiLine"></asp:TextBox>

If you do not want your text boxes multi-line, you can intercept the key press command in JavaScript to do nothing when entered is pressed.

This is an example how

function hookUpToEnterKey()
{
    // Hook up to read enter key
    document.onkeydown = processEntryKey;
}

function processEntryKey(e)
{

    if( !e ) 
    {
        if( window.event ) 
        {
        //Internet Explorer
        e = window.event;
        } 
        else 
        {
        // Cannot get the even return.
        return;
        }
    }

    if( typeof( e.keyCode ) == 'number'  ) 
    {
        //DOM
        e = e.keyCode;
    } 
    else 
        if( typeof( e.which ) == 'number' ) 
        {
            //NS 4 compatible
            e = e.which;
        } 
        else 
            if( typeof( e.charCode ) == 'number'  ) 
            {
                //also NS 6+, Mozilla 0.9+
                e = e.charCode;
            } 
            else 
            {
                //total failure, we have no way of obtaining the key code
                return;
            }

      if(e == 13) 
      {
         // Do nothing
         return false;
      }
}

Upvotes: 2

John
John

Reputation: 17471

Your browser is trying to be a nice guy and click the button for you, even if you didn't set it to be the "default" (it will "click" the first button in the form on enter).

Like David said, if you want the enter key to cause a line break in the textbox, it needs to be multi-line

Upvotes: 0

Matthew Groves
Matthew Groves

Reputation: 26116

This is true for any webform: if you press enter while an input field has focus, the form will be submitted (except textareas). To stop that, you'll need some JavaScript to capture that event and prevent the form being submitted. Be aware though, pressing enter to submit is expected behavior for many users!

Upvotes: 3

Related Questions