2016-04-30 14 views
0

Weiß nicht, was ich falsch mache, aber ich bin wenn das Ziel leer ist, sollte es eine Warnung bringen und wenn nicht gesendet sollte nicht.Wenn Textbox leer ist funktioniert nicht

aber kann nicht scheinen, um herauszufinden, was das Problem ist,

<html lang="en"> 
<head> 
<script type="text/javascript"> 
    function CheckFormPrac(form){ 

     var pcheck = document.getElementById("phone").value; 
     pattern = /^^02\d{8}$/; 

     if (!pattern.test(pcheck)) { 
      alert("Please input your number in format of 02########."); 
      return false; 
     } else { 
      return true; 
     } 

     var cdest = document.getElementById("dest").value; 
     if (cdest == ""){ 
      alert("Destination has not been filled."); 
      return false; 
     } else { 
      return true; 
     } 

    } 
</script> 
</head> 
<body> 
<form id="ffform" method="get" action="" 
Onsubmit="return CheckFormPrac(this);" > 
<fieldset> 
     Home Phone: 
    <input type="text" name="phone" id="phone" size=15 onblur="CheckFormPrac(this);" /> <br/> 

    What is your favorite destination to fly to? 
    <input type="text" name="dest" id="dest" size=30 onblur="CheckFormPrac(this);"/> <br/> 
    <input type="submit" value="Submit" /> 
    <input type="reset" value="Reset"/> 
</form> 

Antwort

0

Das Problem ist, dass der Code, der für den Wert von #dest prüft wird nie erreicht.

if(!pattern.test(pcheck)) { 
    alert("Please input your number in format of 02########."); 
    return false; 
} else { 
    return true; 
} 

gibt immer das Steuerelement von der Funktion zurück und der folgende Code wird nicht ausgeführt. Entfernen Sie den else Block von diesem und der Code überprüft auf #dest Wert.

Beachten Sie, dass return true; nicht aus dem Ereignishandler als Standardaktion des Formulars erforderlich ist.

Hier vollständiger Code mit einigen Änderungen:

function CheckFormPrac() { 
    var pcheck = document.getElementById("phone").value; 
    if(!/^02\d{8}$/.test(pcheck)) { 
     alert("Please input your number in format of 02########."); 
     return false; 
    } 

    if(document.getElementById("dest").value.trim() === "") { 
     alert("Destination has not been filled."); 
     return false; 
    } 
} 
+0

Dank dieser (minus die Warnungen) tun, ich habe sowohl die return true entfernt; Wie Sie gesagt haben, ist dies die Standardaktion des Event-Handlers. :) Und es funktionierte nachdem ich id = "dest" in die Eingabe gesetzt habe :) danke – josh

0

Sie haben einige Fehler in der Form und auch, wie Sie Ihre onsubmit anrufen. Auch Sie können, dass ohne JavaScript-

https://jsfiddle.net/stevenkaspar/uoLrsz78/

<form method="get" action="/"> 
    Home Phone: 
    <input type="text" name="phone" pattern='(02)[0-9]{8}' required/> <br/> 

    What is your favorite destination to fly to? 
    <input type="text" name="dest" required/> <br/> 
    <input type="submit" value="Submit" /> 
    <input type="reset" value="Reset"/> 
</form> 
Verwandte Themen