一个Bootstrap的例子--关于validate

来源：互联网发布：淘宝上面做销售怎么做编辑：程序博客网时间：2024/06/05 22:55

</pre><pre name="code" class="html"><%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%><!DOCTYPE html><html lang="en" class="app"><head><meta charset="utf-8" /><title>毕加数据</title><meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" /><link rel="stylesheet" href="../../css/app.v2.css" type="text/css" /><link rel="stylesheet" href="../../css/font.css" type="text/css" cache="false" /><link rel="stylesheet" href="../../js/calendar/bootstrap_calendar.css" type="text/css" cache="false" /><script src="../../js/app.v2.js"></script></head><body><%@ include file="../../navHead3.jsp" %><div class="col-lg-7"><h3>注册企业账号</h3><br><form action="insertBranch" id="insertBranch" method="post" >  <input  name="appClient.type" value="2"  style="display:none"   > <input  name="appClient.companyId" value="${branchCompany.id}"  style="display:none"   > <input  name="appClient.usedCount" value="0"  style="display:none"   ><div class="form-group"><label >用户名</label><input class="form-control {required:true,minlength:5,,messages:{required:'请输入客户名称'}" id="name1"    placeholder="请输入用户名" name="appClient.userName"/></div><div class="form-group"><label>密码</label><input class="form-control" id="password" placeholder="请输入密码" type="password" name="appClient.password"></div><div class="form-group"><label>确认密码</label><input class="form-control"   name="confirm_password" placeholder="请输入密码" type="password" ></div><div class="form-group"><label>电话</label><input class="form-control" placeholder="请输入电话" name="appClient.phone"></div><div class="form-group"><label>公司名称</label><input class="form-control" placeholder="请输入公司名称" name="appClient.companyName"></div><div class="form-group"><label>业务员数量</label><input class="form-control" placeholder="请输入业务员数量" name="appClient.appCount"></div>  <br>  <button type="submit" class="btn btn-large btn-success">提交</button></form>  <!--弹出显示框--><div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">    <div class="modal-dialog">        <div class="modal-content">            <div class="modal-header">                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>                <h4 class="modal-title" id="myModalLabel">提示</h4>            </div>            <div class="modal-body">           <div id="result"></div>            </div>            <div class="modal-footer">              <buttononclick="javascript:parent.location.href='../../module/appclient/getAllBranch'"type="button" class="btn btn-default" data-dismiss="modal">关闭</button>            </div>        </div>        <!-- /.modal-content -->    </div></div></div><!-- jQuery --><scriptsrc="../../resources/bower_components/jquery/dist/jquery.min.js"></script><script src="../../resources/js/jquery.validate.min.js"></script><script src="../../resources/js/messages_zh.min.js"></script><script src="<%=request.getContextPath() %>/resources/bower_components/bootstrap/dist/js/bootstrap.min.js"></script><script>$().ready(function() {// validate signup form on keyup and submit$("#insertBranch").validate({rules: {'appClient.password' : {required: true,minlength: 6},'confirm_password': {required: true,equalTo: "#password"}},messages: {'confirm_password': {required: "请确认密码",equalTo: "两次输入的密码要相同" }},submitHandler:function(){        var txtHtml;    $.ajax({    url:'insertBranch',    data:$('#insertBranch').serialize(),    type:"POST",    success:function(data2){    var data;      try {       data = $.parseJSON(data2);     }   catch  (e)   {         alert("网络异常 请重新登陆");     }                            if(data.resultcode == "200"){        txtHtml="<p class='text-warning'>" + data.info + "</p>";                    }else{                    txtHtml="<p class='text-warning'>" + data.info + "</p>";                    }                    $("#result").html(txtHtml);        $("#myModal").modal("show");                }    });        }});});</script><%@ include file="../../navTail.jsp" %></body></html>

</pre><pre code_snippet_id="1590342" snippet_file_name="blog_20160227_3_6997779" name="code" class="html">使用struts做后台

<pre name="code" class="html">       <package name="appclent" namespace="/module/appclient" extends="json-default,basePack" >   <action name="insertBranch" class="appClientAction" method="insertBranch"><result type="json"><param name="root">resultObj</param>  </result></action>       </package>

appClientAction如下:

</pre><pre name="code" class="java">private String resultObj;  //string类型的成员变量public String insertBranch(){//省略部分代码JSONObject joCode=new JSONObject();try {joCode.put("resultcode", 123);joCode.put("info", 123);joCode.put("url", "../../mainPage.jsp");} catch (Exception e) {// TODO Auto-generated catch blocke.printStackTrace();}resultObj=joCode.toString();System.out.println(resultObj+"  resultObj");return SUCCESS;}

jsp页面里用的的技术点包括

jquery的validate与bootstrap的模态窗口

其中validate还有点问题

可参见

http://www.runoob.com/jquery/jquery-plugin-validate.html

0 0