无法执行表单验证

时间:2014-08-23 15:21:12

标签: java javascript jsp servlets

我尝试使用javascript在jsp中的注册表单上执行表单验证。我无法做到。 尽管字段为空白,但页面会在单击提交按钮时指向下一页。奇怪的是,空白数据输入数据库(行添加空白条目)。

       <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>

3 个答案:

答案 0 :(得分:0)

function ckh(ev){
  ev.preventDefault();
  //... do stuff here
}
这是有效的吗?如果不是,请尝试在函数中记录参数:您应该将事件作为第一个参数,然后尝试onsubmit =&#34; chk()&#34;没有回报

答案 1 :(得分:0)

以下是解决您问题的代码:

在Jquery中:

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

在Javascript中: 将函数调用为onclick =&#34; cancelFormSubmission()&#34;

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

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

答案 2 :(得分:0)

您的代码无法正常工作,因为您拼写错误NaN; NaN拼写了一点点。在代码中,您在第16行有var a=isNAN(mo);。将其更改为var a=isNaN(mo);