一个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 运行 ...
随机推荐
- 使用JdbcTemplate 操作PostgreSQL，当where条件中有timestamp类型时，报错operator does not exist: timestamp w/out timezone
今天遇到一个问题,找了还半天,Google一下,官网显示是一个bug. 思考一番肯定是类型出了问题. Controller: Service:转化时间戳 Dao: 一波转换搞定!
- C++并发高级接口：std::async和std::future
std::async和std::future std::async创建一个后台线程执行传递的任务,这个任务只要是callable object均可,然后返回一个std::future.future储存 ...
- 利用Bioperl的SeqIO模块解析fastq文件
测序数据中经常会接触到fastq格式的文件,比如说拿到fastq格式的原始数据后希望查看测序碱基的质量并去除低质量碱基.一般而言大家都是用现有的工具,比如说fastqc这个Java写的小程序,确实很好 ...
- PHP 5 Date/Time 函数
PHP Date/Time 简介 Date/Time 函数允许您从 PHP 脚本运行的服务器上获取日期和时间.您可以使用 Date/Time 函数通过不同的方式来格式化日期和时间. 注释:这些函数依赖 ...
- Android Design Support Library使用详解——TextInputLayout与TextInputEditText
TextInputLayout 在谷歌的Material Design中,文本输入是这样表现的:当用户点击输入框想要输入文字时,如果输入框是空的,那么它的提示文字(hint)就会变小并且同时移动到输入 ...
- android Spinner控件详解
Spinner提供了从一个数据集合中快速选择一项值的办法.默认情况下Spinner显示的是当前选择的值,点击Spinner会弹出一个包含所有可选值的dropdown菜单,从该菜单中可以为Spinner ...
- [CSDN_Markdown] Markdown基本语法
简介 本文介绍Markdown的基本使用方法: 使用标题 加粗.斜体 分割线 列表 引用 我写博客一般将可以独立的内容分节,每一节有一个标题,标题的字体应该与正文的字体有点区别.两个相邻节之间使用分割 ...
- OpenCV Python 录制视频
调用摄像头 引入库支持 初始化 调整界面大小 实时显示 录制视频并保存 fourcc问题解决 代码实现 效果展示 总结 学到实用OpenCV调用笔记本电脑的摄像头,并录制视频保存到本地硬盘的时候,出现 ...
- oracle伪列
Oracle的伪列以及伪表 oracle系统为了实现完整的关系数据库功能,系统专门提供了一组成为伪列(Pseudocolumn)的数据库列,这些列不是在建立对象时由我们完成的,而是在我们建立时由Ora ...
- SpriteKit:检测当新场景显示以后
Detecting When a New Scene Is Presented Sprite Kit在SKScene类中提供2个可以重载的方法用来检测当一个场景过渡出去或过渡进来的时候. 第一个方法是 ...