一个Bootstrap的例子--关于validate
</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">
<button
onclick="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 -->
<script src="../../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 block
e.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
一个Bootstrap的例子--关于validate的更多相关文章
- 用一个简单的例子来理解python高阶函数
============================ 用一个简单的例子来理解python高阶函数 ============================ 最近在用mailx发送邮件, 写法大致如 ...
- Spring-Context之一:一个简单的例子
很久之前就想系统的学习和掌握Spring框架,但是拖了很久都没有行动.现在趁着在外出差杂事不多,就花时间来由浅入深的研究下Spring框架.Spring框架这几年来已经发展成为一个巨无霸产品.从最初的 ...
- 一个Bootstrap风格的分页控件
http://www.cnblogs.com/wangwei123/p/3682626.html 主题 jQueryBootstrap 一个Bootstrap风格的分页控件,对于喜欢Bootstr ...
- jQuery分页插件jBootstrapPage，一个Bootstrap风格的分页插件
一个Bootstrap风格的分页控件,对于喜欢Bootstrap简洁美观和扁平化的同学可以关注jBootstrapPage, 目前jBootstrapPage最新版为V0.1,后续还有更多功能需要完善 ...
- 高仿“点触验证码”做的一个静态Html例子
先上源码: <html> <head> <title>TouClick - Designed By MrChu</title> <meta htt ...
- 关于apriori算法的一个简单的例子
apriori算法是关联规则挖掘中很基础也很经典的一个算法,我认为很多教程出现大堆的公式不是很适合一个初学者理解.因此,本文列举一个简单的例子来演示下apriori算法的整个步骤. 下面这个表格是代表 ...
- 一个UWSGI的例子
摘要:uwsgi执行顺序:启动master进程,执行python脚本的公共代码(import同一层).然后生成worker进程,uwsgi.post_fork_hook=init_functions, ...
- 扩展Python模块系列(二)----一个简单的例子
本节使用一个简单的例子引出Python C/C++ API的详细使用方法.针对的是CPython的解释器. 目标:创建一个Python内建模块test,提供一个功能函数distance, 计算空间中两 ...
- fitnesse - 一个简单的例子（slim）
fitnesse - 一个简单的例子(slim) 2017-09-30 目录1 编写测试代码(Fixture code)2 编写wiki page并运行 2.1 新建wikiPage 2.2 运行 ...
随机推荐
- 入口开始，解读Vue源码（一）-- 造物创世
Why? 网上现有的Vue源码解析文章一搜一大批,但是为什么我还要去做这样的事情呢?因为觉得纸上得来终觉浅,绝知此事要躬行. 然后平时的项目也主要是Vue,在使用Vue的过程中,也对其一些约定产生了一 ...
- 地址四级联动的vue组件
一.效果图如下: 二.思路 主要在vue中结合 mint-ui组件的Picker和Popup方法,负责对json地址进行展示: 三.代码地址 四.说明 address4.json最好是在点击父组件的地 ...
- Gradle 1.12用户指南翻译——第五十章. 依赖管理
本文由CSDN博客貌似掉线翻译,其他章节的翻译请参见:http://blog.csdn.net/column/details/gradle-translation.html翻译项目请关注Github上 ...
- C++格式化输出浮点数
主要内容 介绍C++中如何格式化输出浮点数. 控制浮点数输出格式需要包含iomanip头文件. 使用fixed来控制输出的浮点数的小数位是固定的.可参考http://en.cppreference.c ...
- mybatis映射器配置细则
前面三篇博客我们已经多次涉及到映射器的使用了,增删查基本上都用过一遍了,但是之前我们只是介绍了基本用法,实际上mybatis中映射器可以配置的地方还是非常多,今天我们就先来看看映射器还有哪些需要配置的 ...
- 一小时入门PHP
[版权申明:本文系作者原创,转载请注明出处] 文章出处:[http://blog.csdn.net/sdksdk0/article/details/52332296](http://blog.csdn ...
- Android简易实战教程--第四十三话《上拉加载与下拉刷新》
ListView的下拉刷新很常见,很多开源的框架都能做到这个效果,当然也可以自己去实现.本篇案例是基于xlistview的. 布局: <RelativeLayout xmlns:android= ...
- Freeline--Android平台上的秒级编译方案
Freeline 技术揭秘 Freeline是什么? Freeline是蚂蚁金服旗下一站式理财平台蚂蚁聚宝团队15年10月在Android平台上的量身定做的一个基于动态替换的编译方案,5月阿里集团内部 ...
- Gazebo機器人仿真學習探索筆記（六）工具和实用程序
Gazebo附带了许多工具和实用程序. 这些教程说明了这些可用的工具,以及如何使用它们. 主要有: 1 记录和播放 2 日志过滤 3 应用力/扭矩 4 HDF5数据集 官网介绍通俗具体,非常容易,请参 ...
- Leetcode解题-树(5.0.0)基础类
与第二章类似,LeetCode指定了TreeNode实现.为了方便后续习题的编写和测试,创建一个基础父类,包含TreeNode实现,以及create()和print()创建和打印树的方法.其中crea ...