title: Enter key to submit Ajax form
body: <p>I have a very simple AJAX form that asks for an email address and sends it to me after submitting.  </p>
  
  <p>How can I can I get the form to submit when hitting the enter key?</p>
  
  <p>This runs when user clicks submit button:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
      $(document).ready(function () {
          $("#submit_btn").click(function () {
              // Get input field values:
              var user_email = $('input[name=email]').val();
  
              // Simple validation at client's end
              // We simply change border color to red if empty field using .css()
              var proceed = true;
              if (user_email === "") {
                  $('input[name=email]').css('border-color', 'red');
                  proceed = false;
              }
  
              // Everything looks good! Proceed...
              if (proceed) {
                  /* Submit form via AJAX using jQuery. */
              }
          });
  
          // Reset previously set border colors and hide all message on .keyup()
          $("#contact_form input, #contact_form textarea").keyup(function () {
              $("#contact_form input, #contact_form textarea").css('border-color', '');
              $("#result").slideUp();
          });
      });
  &lt;/script&gt;
  </code></pre>
  
  <hr>
  
  <p>I know this question has been asked before -- I'm having trouble getting the <code>keypress</code> function to work.</p>
  
  <p>I tried this to no avail:</p>
  
  <pre><code>$("#contact_form").keypress(function (e) {
      if ((e.keyCode == 13) &amp;&amp; (e.target.type != "textarea")) {
          e.preventDefault();
          // Get input field values
          var user_email = $('input[name=email]').val();
  
          // Simple validation at client's end
          // We simply change border color to red if empty field using .css()
          var proceed = true;
  
          if (user_email === "") {
              $('input[name=email]').css('border-color', 'red');
              proceed = false;
          }
  
          // Everything looks good! Proceed...
          if (proceed) {
              /* Submit form via AJAX using jQuery. */
          }
      }
  });
  </code></pre>
  
  <p>The form is <code>#contact_form</code>.</p>
  
  <p>Any help would be would appreciated…</p>