简体   繁体   中英

can not perform form validation

I tried performing form validation on a registration form in jsp using javascript. I am not able to do it. The page, despite the fields being blank, is directed to next page on clicking the submit button. And strangely, the blank data is entered in the database(row is added with blank entries).

       <html>

       <head> 

     <script type="text/javascript">
     function ckh()
        {

        var fn=document.rform.fname.value;
        var ln=document.rform.lname.value;
        var lad=document.rform.laddr.value;
        var pad=document.rform.paddr.value;
        var mo=document.rform.mno.value;
        var em=document.rform.email.value;
        var pd=document.rform.pwd.value;
        var a=isNAN(mo);

        var msg="";

        if(fn.length==0)
        {
            msg=msg+"First Name can not be blank! ";

        }

    if(ln.length==0)
    {
        msg=msg+"Last Name can not be blank! ";

    }
    if(lad.length==0)
    {
        msg=msg+"Address can not be blank! ";

    }
    if(pad.length==0)
    {
        msg=msg+"City Name can not be blank! ";
    }



    if(mo.length==0)
    {
        msg=msg+"Please enter mobile number! ";

    }

    if(em.length==0)
    {
        msg=msg+"Enter Email ID! ";

    }

    if(pd.length==0)
    {
        msg=msg+"Password can not be blank! ";

    }

    if(a)
    {
        msg=msg+"Please enter valid phone number! ";

    }

    if(msg.length==0)
    {
    rform.submit();
    }
    else
    {
        alert(msg);
        return false;

    }
     }

  </script>

    <title>Shop Online</title>
   <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
   <link href="style/style.css" rel="stylesheet" type="text/css" />
   </head>

   <body background="images/background3.jpg">
   <center>

    <br>
    <br>

    <div class="wrapper">
   <div class="logo"> Shop<strong>Online</strong></div>
   <div class="menu">
   <ul class="solidblockmenu">
    <li><a href="index.html">Home</a></li>
    <li><a href="login.jsp">LOGIN</a></li>
    <li><a href="register.jsp">REGISTER</a></li>
    <li><a href="http://www.google.com">PRODUCTS</a></li>
    <li><a href="">CONTACT US</a></li>

  </ul>
  <div class="clear"></div>
  </div>
  </div>
    <br>
    <br>

    <% Class.forName("oracle.jdbc.OracleDriver");
       Connection con=DriverManager.getConnection  ("jdbc:oracle:thin:@127.0.0.1:1521:xe","system","manhattan");
       PreparedStatement ps=con.prepareStatement("select *from uinfo");
       ResultSet rs=ps.executeQuery();
       int n=0;
       while(rs.next())
       {
         n=rs.getInt("lid");

       }
       n++;

       //out.println(n);


       con.close();

    %>

    <form name="rform" action="register" method="post" onsubmit="return ckh()">
     <table border="0" cellspacing="11" cellpadding="11" align="center" bgcolor="skyblue">
            <thead>
                <tr>
                    <th colspan="4" align="center">
                        REGISTRATION FORM
                    </th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>
                        First Name
                    </td>
                    <td>
                        <input type="text" name="fname">
                    </td>
                    <td>
                        Last Name
                    </td>
                    <td>
                        <input type="text" name="lname">
                    </td>
                </tr>
                <tr>
                    <td>
                        Address
                    </td>
                    <td>
                        <input type="text" name="laddr">
                    </td>
                    <td>
                        City
                    </td>
                    <td>
                        <input type="text" name="paddr">
                    </td>
                </tr>
                <tr>
                    <td>
                        Mobile No
                    </td>
                    <td>
                        <input type="text" name="mno">
                    </td>
                    <td>
                        Email
                    </td>
                    <td>
                        <input type="text" name="email">
                    </td>
                </tr>
                <tr>
                    <td>
                        Login id
                    </td>
                    <td>
                        <label name="lid"><%=n %></label>
                    </td>
                    <td>
                        Password
                    </td>
                    <td>
                        <input type="password" name="pwd">
                    </td>
                </tr>
                <tr>
                    <td colspan="4" align="center">
                        <input type="submit" value="New User">
                    </td>
                </tr>
            </tbody>
        </table>
    </form>
</center>
</body>
</html>
function ckh(ev){
  ev.preventDefault();
  //... do stuff here
}

is this working ? if no, try to log arguments in your function : you should get the event as the first argument, then try also onsubmit="chk()" without the return

Here's the code that solves your issue:

In Jquery:

$(document).ready(function(){
    $('form').submit(function(event){
        event.preventDefault();
    });
});

or

In Javascript: Calling function as onclick="cancelFormSubmission()"

function cancelFormSubmission(e) {
    var evt = e ? e:window.event;
    if (evt.preventDefault){
       evt.preventDefault();
    }
    evt.returnValue = false;

    // Add your validation code from here
    ----
    ----
    ----
}

Your code doesn't work because you have misspelled NaN ; NaN is spelled with a little a. In your code you have var a=isNAN(mo); at line 16. Change it to var a=isNaN(mo); .

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM