how to link jquery code to jsp code to display form? -
$(function(){ // setup form validation on #register-form element $("#loginform").validate({ // specify validation rules rules: { uid: "required", password: { required: true, minlength: 5 }, confirmpassword: { required: true, minlength: 5, equalto: "#password" }, role: "required", }, // specify validation error messages messages: { uid: "please enter user id", password: { required: "please provide password", minlength: "your password must @ least 5 character", }, confirmpassword: { required: "please provide password", minlength: "your password must @ least 5 character", equalto: "your password should same above" }, role: "please specify role", }, onclick: function(loginform) { loginform.submit(); } }); }); <%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %> <%@ page language="java" contenttype="text/html; charset=utf-8" pageencoding="utf-8" %> <!doctype html public "-//w3c//dtd html 4.01 transitional//en" "http://www.w3.org/tr/html4/loose.dtd"> <%@ include file="include.jsp" %> <!-- <div id="body"> --> <%-- page 1. rendering time: <%=new java.util.date()%> --%> <!-- </div--> <html> <!-- <head> --> <!-- <meta http-equiv="content-type" content="text/html; charset=utf-8"> --> <!-- </head> --> <body> <div> <form method="post" id="loginform" name="loginform" action="page1.jsp"> <table cellpadding="5" border="0"> <h3> add new user </h3> <tr> <td align="center">user id:</td> <td><input tabindex="2" size="60" type="text" name="uid" id="uid"/></td> </tr> <tr> <td align="center">password:</td> <td><input tabindex="2" size="60" type="password" name="password" id="password"/></td> </tr> <tr> <td align="center">confirm password:</td> <td><input tabindex="2" size="60" type="password" name="confirmpassword" id="confirmpassword"/></td> </tr> <tr> <td align="center">role:</td> <td><select name="role"> <option value="">select specific role alloted user</option> <option value="ops(operational)">ops(operational)</option> <option value="helpdesk">helpdesk</option> </select></td> </tr> <tr> <td colspan="4"><input tabindex="5" type="button" value="submit" onclick="validate();"/></td> </tr> </table> </form> </div> </body> </html>i have jsp page display form. have included jquery library in other jsp file. jquery code not working. m unable have client side validations on browser. , submit button code not working. plz me.
to submit can try this
function validate() { var flag = false; flag = $("#loginform").valid(); if (flag) { document.loginform.action = "page1.jsp"; document.loginform.submit(); } } here .valid() default provided jquery.validat.js returns true or false
edited: simplest demo tried
index.jsp
<%@ page language="java" contenttype="text/html; charset=utf-8" pageencoding="utf-8" %> <!doctype html public "-//w3c//dtd html 4.01 transitional//en" "http://www.w3.org/tr/html4/loose.dtd"> <%@ include file="include.jsp" %> <!-- <div id="body"> --> <%-- page 1. rendering time: <%=new java.util.date()%> --%> <!-- </div--> <html> <!-- <head> --> <!-- <meta http-equiv="content-type" content="text/html; charset=utf-8"> --> <!-- </head> --> <body> <div> <form role="form" id="form"> <div class="form-group"><label>password</label> <input type="password" placeholder="password" class="form-control" name="password"></div> <div class="form-group"><label>url</label> <input type="text" placeholder="enter email" class="form-control" name="url"></div> <div class="form-group"><label>number</label> <input type="text" placeholder="enter email" class="form-control" name="number"></div> <div class="form-group"><label>minlength</label> <input type="text" placeholder="enter email" class="form-control" name="min"></div> <div class="form-group"><label>maxlength</label> <input type="text" placeholder="enter email" class="form-control" name="max"></div> <div> <button class="btn btn-sm btn-primary m-t-n-xs" type="submit"><strong>submit</strong></button> </div> </form> </div> </body> </html> include.jsp
<script src="jquery-2.1.1.js"></script> <script src="jquery.validate.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("#form").validate({ rules: { password: { required: true, minlength: 3 }, url: { required: true, url: true }, number: { required: true, number: true }, min: { required: true, minlength: 6 }, max: { required: true, maxlength: 4 } } }); }); </script> </script>
Comments
Post a Comment