Question

我想知道我的代码有什么问题。它假设JSP将在转到servlet之前首先验证所有字段，是否需要，文本字段格式等。我在使用servlet之前使用以下代码检查jsp本身。但是，这并不起作用，因为它没有触发我的jsp函数validation（）代码，它直接进入servlet。

<form action="RegistrationServlet" method="post" enctype="multipart/form-data" onSubmit="return validation(event);">

以下代码将是我的JSP：

<!DOCTYPE HTML><%@page language="java"
    contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>
<html>
<head>
<title>Registration</title>

<script>





function validation(){

    var userid =document.getElementById("userID").value;
        var firstName= document.getElementById("fName").value;
        var lastName = document.getElementById("lName").value;
        var phoneNo= document.getElementById("phoneNo").value;
        var dateOfBirth=document.getElementById("dob").value;
        var displayName= document.getElementById("dName").value;
        var password = document.getElementById("password").value;
        var address= document.getElementById("address").value;
        var interest = document.getElementById("interest").value;
        var emailAddress = document.getElementById("emailAddress").value;
        //var profilePic=document.getElementById("profilePic").value;
        var profilePiclbl=document.getElementById("lblProfilePic").innerHTML;
    alert("cc");
alert(emailAddress);



    //first check  all whether is it empty
            //check individual whether is it empty 

        //else forward to next page & create session
            //check the format 
                // forward to next page & create session
                    //servlet check label is it empty if not send to confirmation page


            if(firstName==""){
                document.getElementById("lblfName").style.color = "red";
                document.getElementById("lblfName").innerHTML="Please fill in your first name.";
                alert("Please check your first name.");
                return false;
            }
            else {
            document.getElementById("lblfName").innerHTML="";
            }
            if(lastName==""){
                document.getElementById("lbllName").style.color = "red";
                document.getElementById("lbllName").innerHTML="Please fill in your last name.";
                alert("Please check your last name.");
                return false;
            }
            else {
            document.getElementById("lbllName").innerHTML="";
            }
            if(displayName==""){
            document.getElementById("lbldName").style.color = "red";
                document.getElementById("lbldName").innerHTML="Please fill in your display name.";
                alert("Please check your display name.");
                return false;
            }
            else {
            document.getElementById("lbldName").innerHTML="";
            }



            if($("#dob").datepicker("getDate") === null) {
                document.getElementById("lblDOB").style.color = "red";
        document.getElementById("lblDOB").innerHTML="Please fill in your date of birth.";
         return false;
                }
            else {
            document.getElementById("lblDOB").innerHTML="";
            }


if(phoneNo==""){
document.getElementById("lblphoneNo").style.color = "red";
                document.getElementById("lblphoneNo").innerHTML="Please fill in your phone number.";
                alert("Please check your phone number.");
                return false;
            }
            else {
            document.getElementById("lblphoneNo").innerHTML="";
            }

if(userid==""){document.getElementById("lblUserID").style.color = "red";
                document.getElementById("lblUserID").innerHTML="Please fill in your user ID.";
                alert("Please check your user ID.");
                return false;
            }
            else {
            document.getElementById("lblUserID").innerHTML="";
            }





            if(password==""){
            document.getElementById("lblPassword").style.color = "red";
                document.getElementById("lblPassword").innerHTML="Please fill in your password.";
                alert("Please check your password.");
                return false;
            }
            else {
            document.getElementById("lblPassword").innerHTML="";
            }

            if(emailAddress==""){
            document.getElementById("lblemailAddress").style.color = "red";
                document.getElementById("lblemailAddress").innerHTML="Please fill in your email address.";
                alert("Please check your email address.");
                return false;
            }
            else {
            document.getElementById("lblemailAddress").innerHTML="";
            }

            if(address==""){
                document.getElementById("lblAddress").style.color = "red";
                document.getElementById("lblAddress").innerHTML="Please fill in address.";
                alert("Please check address.");
                return false;
            }
            else {
            document.getElementById("lblAddress").innerHTML="";
            }



             if(interest==""){
                document.getElementById("lblInterest").style.color = "red";
                document.getElementById("lblInterest").innerHTML="Please fill in your interest.";
                alert("Please check your interest."); 
                return false;
            }
            else {
            document.getElementById("lblInterest").innerHTML="";
            }




    if(firstName!="" || lastName!="" || userid!="" || phoneNo!="" || dateOfBirth!="" || displayName!="" || password!="" || address!=""|| interest!=""|| emailAddress!=""){
 var letters = /^[A-Za-z]+$/;  
 var numbers = /^\d{8}$/;  
  var re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;


   if(!firstName.match(letters)|| !lastName.match(letters)){
   if (!firstName.match(letters)){
   document.getElementById("lblfName").style.color = "red";
   document.getElementById("lblfName").innerHTML="Please check your spelling of your first name.";
   return false;
   }else{
   document.getElementById("lblfName").innerHTML="";
   }
   if(!lastName.match(letters)){
    document.getElementById("lbllName").style.color = "red";
    document.getElementById("lbllName").innerHTML="Please check your spelling of your last name.";
    return false;
   }else{
   document.getElementById("lbllName").innerHTML="";
   }
    }
    //mid
    else{
    document.getElementById("lbllName").innerHTML="";
       document.getElementById("lblfName").innerHTML="";
    } 
     if(!phoneNo.match(numbers)){
         document.getElementById("lblphoneNo").style.color = "red";
     document.getElementById("lblphoneNo").innerHTML="Please check your phone number.";
     return false;
    }else {
     document.getElementById("lblphoneNo").innerHTML="";

    }


    if (!emailAddress.match(re)) { 
     document.getElementById("lblemailAddress").style.color = "red";
  document.getElementById("lblemailAddress").innerHTML="Please check your email address.";
     return false;
  }else{
    document.getElementById("lblemailAddress").innerHTML="";
  }
    if (profilePiclbl!="") { 

     return false;
  }else{
    document.getElementById("lblProfilePic").innerHTML="";
    return true;
  }






                 // $("#passRegi").val("success");
                    //alert($("#passRegi").val());

        }


}   </script>
<form action="RegistrationServlet" method="post" enctype="multipart/form-data" onSubmit="return validation(event);">
Registration

<table>
<tr>
<td>First Name:</td>
<td> <input type="text" name="fName" id="fName"></td>
<td> <label for="lblfName" id="lblfName" ></label></td>
</tr>

<tr>
<td>Last Name :</td>
<td> <input type="text" name="lName" id="lName"></td>
<td> <label for="lblDOB" id="lbllName"></label></td>
</tr>

<tr>
<td>Display Name :</td>
<td> <input type="text" name="dName" id="dName"></td>
<td> <label for="lblDOB" id="lbldName"></label></td>
</tr>

<tr>
<td>Date Of Birth :</td>
<td> <input type="text" name="dob" id="dob"></td>
<td> <label for="lblDOB" id="lblDOB"></label></td>
</tr>
<tr>
<td>Phone Number:</td>
<td> <input type="text" name="phoneNo" id="phoneNo"></td>
<td> <label for="lblphoneNo" id="lblphoneNo"></label></td>

</tr>


<tr>
<td>Email Address:</td>
<td> <input type="text" name="emailAddress" id="emailAddress"></td>
<td><label for="lblemailAddress" id="lblemailAddress"><div style="color: #FF0000;">${errorMessage}</div></label></td>

</tr>
<tr>
<td>Password:</td>
<td> <input type="password" name="password"  id="password" onkeyup="CheckPasswordStrength(this.value)"></td>
<td> <label for="lblPassword" id="lblPassword"></label></td>
<td><label for="password_strength" id="password_strength"></label></td>

</tr>

<tr>
<td>Address:</td>
<td> <input type="text" name="address"  id="address"></td>
<td> <label for="lblAddress" id="lblAddress"></label></td>
</tr>
<tr>
<td>Profile Picture:</td>
<td> <input type="file" name="profilePic"  id="profilePic"  accept="image/*"  onChange="previewFile()"></td>
<td> <label for="lblProfilePic" id="lblProfilePic"></label></td>

</tr>
<tr>
<td>Interest:</td>
<td> <input type="text" name="interest" id="interest"></td>
<td> <label for="lblInterest" id="lblInterest"></label></td>
</tr>
</table>
  <input type="submit" value="Submit" onClick="validation();">
</form>

</body>
</html>

Answer 1

因为你在validation（）函数中有一些错误。您没有在任何HTML元素中定义userID id，因此验证函数在第一行validation（）函数期间停止执行，因此它无法返回任何值，这会导致表单提交而无需验证。

var userid =document.getElementById("userID").value;  //userID is not present in any html element.

请尝试添加userID id的输入字段或将其删除。

JSP在进入servlet之前首先验证了自己

1 个答案: