prevent enter on submit button only, not the rest of the form

Question

ok, so i've been searching for a piece of code that does this, and nothing applies to my situation.

My Problem: i'm trying to prevent the form from submitting when the "ENTER" key is pressed but allowing the my search script thats inside the form to submit when the enter key is pressed.

What i've found are scripts that prevent the Enter key period, or the script doesn't work because i think i'm using a <button> instead of a <input> as my submit button, i'm not really sure.

my form

<form action="" method="post" onsubmit="return false;" id="myform">

my javascript that does my search

    function showSub(str) {
    var xmlhttp;
    if (str=="") {
      document.getElementById("txtSub").innerHTML="";
      return;
    }
    if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari
      xmlhttp=new XMLHttpRequest();
    }
    else {// code for IE6, IE5
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange=function() {
      if (xmlhttp.readyState==4 && xmlhttp.status==200) {
        document.getElementById("txtSub").innerHTML=xmlhttp.responseText;
      }
    }
    xmlhttp.open("GET","findLogo.php?q="+encodeURIComponent(str),true);
    xmlhttp.send();
}  
$(document).on('change', '#searchText', function() {
// Get the search text
var searchText = $(this).val();
// Make sure it isn't empty
    if (searchText.length > 0) {
        // Send the update request
        showSub(searchText);
    }
});

my search input

<input type="text" id="searchText" value="" />
<div id="txtSub"></div>

my submit button

<input type="hidden" value="Post" name="submit" /> 
<button type="submit" style="height:33px; width:50px">
<img src="../css/images/plus_25.png" />
</button>

my java-script post submit script

<script type="text/javascript">
$(function(){
    $('button[type=submit]').click(function(e){
        e.preventDefault();
        $.ajax({
            type: "POST",
            url: "postadd.php",
            data: $("#myform").serialize(),
            beforeSend: function(){
                $('#result').html('<div class="success"><img src="../images/loading-blue.gif" width="25" /></div>');
            },
            success: function(data){
                $('#result').html(data);
                $('html, body').animate({scrollTop:$(document).height()}, 'slow');
                //document.getElementById('footer').scrollIntoView();
            }
        });
    });
});

Answer 1

The Solution is basically based on detecting keypress and preventing form submission

1. First of all make two buttons for searching and form submission as <input type="button" />
2. To differentiate between search button and submit button add classes to it with your suitable name here I added .submit and .Search
3. Another thing , chaining is used on .submit button it is used to prevent click event block from executing if key pressed is enter key
4. With preventing submission with enter key results in another problem if any other button is click by selecting that button form will enter to prevent that else case is also added which prevents button based form submission with submit button and another plus point is you can add any custom button for submission
5. Next the Click block submits the form which is reached by passing through step 4 which stops if key press was cause of starting to execute the process

---

Two Examples added one with submit button based on click only another for search based on both click/Enter

Another Plus point is that it does not prevent you from using enter for search button

Solved Click for demo To know the difference submit with enter key and search with enter key

HTML

<input type="button" class="Submit" value="Submit"/>

<input type="button" class="Search"  value="Search"/>

Jquery

$("input.Submit").keypress(function(event){

    if(event.which=='13'){

        alert("Key enter key entered ");
     event.preventDefault();



 }else{
      event.preventDefault();
    }


}).click(function(event){
    alert("Here is the submit Button works on click write jquery ");

  $( "#FormId" ).submit();
});


//The Code For Search Which could be triggered by both keypress and click


  $("input.Search").click(function(event){

              alert("Works for both enter and click");
            });

EDIT:

Demo With Search just like google on entering text to search on text box and clicking enter triggers the search

The enter some text in search box press enter key

Jquery

$("input.Search").keypress(function(event){

          if(event.which=='13'){

            alert("Key enter key entered ");

        }
    });