HTML-Formular zu verhindern, senden, wenn drücken Sie auf bestimmte Eingabe eingeben

Question

Ich habe ein HTML-Formular mit einigen Eingabefeldern, eines der Eingabefeld ist Suchfeld, wenn ich auf die Suchschaltfläche neben diesem Suchfeld klicken, Suchergebnisse werden vom Server mit Ajax zurückgegeben werden, was ich will ist, um die Übermittlung von Formularen zu verhindern, wenn der Benutzer sich auf dieses spezielle Sucheingabefeld konzentriert und die Eingabetaste drückt. Übrigens, ich benutze AngularJS, also könnte die Lösung ein bisschen anders sein als JQuery oder pures Javascript, wie ich finde .. Do-inable? Jeder Rat würde geschätzt werden!

Answer 1

In der Schaltfläche Click-Handler tun ein e.preventDefault()

function clickHandler(e){ 
    e.preventDefault(); 
} 

Sie auch eine button anstelle eines Submit-Button verwenden können.

Answer 2

Verwenden Sie eine Funktion wie:

function doNothing() { 
 
var keyCode = event.keyCode ? event.keyCode : event.which ? event.which : event.charCode; 
 
    if(keyCode == 13) { 
 

 

 
\t if(!e) var e = window.event; 
 

 
\t e.cancelBubble = true; 
 
\t e.returnValue = false; 
 

 
\t if (e.stopPropagation) { 
 
\t \t e.stopPropagation(); 
 
\t \t e.preventDefault(); 
 
\t } 
 
}

<form name="input" action="http://www.google.com" method="get"> 
 
<input type="text" onkeydown="doNothing()"> 
 
<br><br> 
 
<input type="submit" value="Submit"> 
 
</form>

JSFIDDLE HERE

Answer 3

When you submit form using enter key on particular text fields or submit button(focus). 
To prevent form submit twice, we can use both approach 

1. 
define var isEnterHitOnce=true globally which loaded at the time of form load 

on keyPress Event or on submitForm() 

if(event.keycode==13 && isEnterHitOnce){ 
isEnterHitOnce=false; 
//Process your code. Sent request to server like submitForm(); 
} 
isEnterHitOnce=false; 


2. 
disable the field object from where you received the action like 
beginning of method in formSubmit() 
    document.getElementById(objName).disabled=true; // objName would be your fields name like submitButton or userName 


//At the end of method or execution completed enable the field 
    document.getElementById(objName).disabled=false;