Jquery 异步提交表单(post)
方法 $.post(url,params,function(data){});
表单的action，method属性都没有
input 的类型只能为button不能为submit只能为button,否则点击button会执行表单action,不会走jquery异步
前台代码
<script type="text/javascript">
$(function()
{
//异步提交表单
$("#save").click(function(){
$.post("${ctx}/order/save.action",$("#form1").serialize(),function(data){
if(data=="true")
{
alert ("备注保存成功");
}
})
})
})
</script>
<form id="form1" >
<input type="hidden" name ="oid" value="${orderVo.id}">
<textarea class="form-control" name ="remark" id ="text" rows="3" cols="140" >${orderVo.remark}</textarea>
<input id="save" class="btn btn-primary" type="button" value="保存" />后台代码:
public void save(){
PrintWriter out=null;
try {
System.out.println(oid);
System.out.println(remark);
orderService.saveRemark(oid,remark);
HttpServletResponse response=ServletActionContext.getResponse();
out=response.getWriter();
out.print(true);
out.flush();
out.close();
} catch (Exception e) {
e.printStackTrace();
out.flush();
out.close();
out.println(0);
}
}webx框架
velocity模板实现代码
分页bean
package com.alibaba.uyuni.biz.common.bo.dto;
import java.io.Serializable;
import com.alibaba.uyuni.common.enums.NumEnum;
/**
* 类Page.java的实现描述：TODO 类实现描述
*
* @author 杨冬 2014年8月21日 下午1:19:25
*/
public class UyuniPage<T> implements Serializable {
/**
*
*/
private static final long serialVersionUID = 8104777827863916550L;
/** 每页显示记录数 **/
private Integer pageSize;
/** 查询的集合 **/
private T data;
/** 总页数 **/
private int totalPage;
/** 当前页，第几页 **/
private Integer pageIndex;
/** 总记录数 **/
private Integer totalNum;
/** 是否有下页 **/
private boolean hasNextPage = false;
/** 是否有上页 **/
private boolean hasPreviousPage = false;
/**
* @param pageSize 每页条数
* @param pageIndex 当前页，第几页
* @param totalNum 总记录数
* @param data 查询的集合
*/
public UyuniPage(Integer pageSize, Integer pageIndex, Integer totalNum, T data){
super();
if (pageSize == null || pageSize == 0) {
pageSize = NumEnum.FIVE.getValue();
}
if (pageIndex == null || pageIndex == 0) {
pageIndex = NumEnum.ONE.getValue();
}
if (totalNum == null || totalNum == 0) {
totalNum = 0;
}
this.pageSize = pageSize;
this.data = data;
// pageSize==0会报错
this.totalPage = (totalNum % pageSize == 0) ? (totalNum / pageSize) : (totalNum / pageSize + 1);
this.pageIndex = (pageIndex == 0) ? (1) : (pageIndex);
this.totalNum = totalNum;
this.hasNextPage = (this.totalPage > 1 && this.totalPage > this.pageIndex);
this.hasPreviousPage = (this.pageIndex > 1);
}
/**
* @return the pageSize
*/
public Integer getPageSize() {
return pageSize;
}
/**
* @param pageSize the pageSize to set
*/
public void setPageSize(Integer pageSize) {
this.pageSize = pageSize;
}
/**
* @return the data
*/
public T getData() {
return data;
}
/**
* @param data the data to set
*/
public void setData(T data) {
this.data = data;
}
/**
* @return the totalPage
*/
public int getTotalPage() {
return totalPage;
}
/**
* @param totalPage the totalPage to set
*/
public void setTotalPage(int totalPage) {
this.totalPage = totalPage;
}
/**
* @return the pageIndex
*/
public Integer getPageIndex() {
return pageIndex;
}
/**
* @param pageIndex the pageIndex to set
*/
public void setPageIndex(Integer pageIndex) {
this.pageIndex = pageIndex;
}
/**
* @return the totalNum
*/
public Integer getTotalNum() {
return totalNum;
}
/**
* @param totalNum the totalNum to set
*/
public void setTotalNum(Integer totalNum) {
this.totalNum = totalNum;
}
/**
* @return the hasNextPage
*/
public boolean isHasNextPage() {
return hasNextPage;
}
/**
* @param hasNextPage the hasNextPage to set
*/
public void setHasNextPage(boolean hasNextPage) {
this.hasNextPage = hasNextPage;
}
/**
* @return the hasPreviousPage
*/
public boolean isHasPreviousPage() {
return hasPreviousPage;
}
/**
* @param hasPreviousPage the hasPreviousPage to set
*/
public void setHasPreviousPage(boolean hasPreviousPage) {
this.hasPreviousPage = hasPreviousPage;
}
/**
* @return the serialversionuid
*/
public static long getSerialversionuid() {
return serialVersionUID;
}
}
vm页面
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.js"></script>
<script type="text/javascript">
$(function()
{
$("#confirm").click(function(){
var studentId=$("#studentId").val();
if(studentId==""){
alert("新增学生");
$.ajax({
url:"/project/studentRpc/newStudent.json",
type:"post",
data:$('#studentform').serialize(),
dataType: 'json',
success:function(data){
var isAdd= data.content.successed;
if(isAdd==true){
alert("新增成功");
window.location.reload();
}
}
});
}else{
//更新学生
$.ajax({
url:"/project/studentRpc/"+studentId+"/updateStudent.json",
type:"post",
data:$('#studentform').serialize(),
dataType: 'json',
success:function(data){
var isDeleted= data.content.successed;
if(isDeleted==true){
alert("更新成功");
window.location.reload();
}
}
});
}
})
})
</script>
</head>
<body>
#if(${studentDto.id})
修改
#else
新增
#end
<form id="studentform">
<input id="studentId" type="hidden" name="id" value="$!studentDto.id"><br>
姓名<input type="text" name="name" value="$!studentDto.name"><br>
年龄<input type="text" name="age" value="$!studentDto.age"><br>
性别<input type="text" name="sex" value="$!studentDto.sex"><br>
年级<input type="text" name="grade" value="$!studentDto.grade"><br>
班级<input type="text" name="team" value="$!studentDto.team"><br>
老师<input type="text" name="teacher" value="$!studentDto.teacher"><br>
</form>
<button id="confirm">提交</button>
</body>
buttom标签必须放到form标签外面，否则点击button会执行表单action,不会走绑定的异步事件
分页显示页面
#set($nextpage=$pb.pageIndex + 1)
#set($previouspage=$pb.pageIndex - 1)
#if($pb.hasPreviousPage == true)
<a href="/project/student/studentshow.htm?pageIndex=$previouspage">上一页</a>
#end
#if($pb.hasNextPage == true)
<a href="/project/student/studentshow.htm?pageIndex=$nextpage">下一页</a>
#end
<br>
#foreach(${studentDto} in ${result})
<tr>
<td>${studentDto.id}</td>
<td>${studentDto.name}</td>
<td>${studentDto.age}</td>
<td>${studentDto.sex}</td>
<td>${studentDto.grade}</td>
<td>${studentDto.team}</td>
<td>${studentDto.teacher} </td>
<td><a href="/project/student/form.htm?studentId=${studentDto.id}">编辑</a></td>
<td><a href="javascript:void(0);" onclick = "return delStudent(${studentDto.id});">删除</a></td>
</tr>
<br>
#end
<a href="/project/student/form.htm">新增</a>
</div>
vm做加减运算必须在set标签里面做，且运算符两边必须有空格
#set($a=10)
#set($b=$a - 1)
------------
<span>$b</span>不能直接像freemaker一样 ${b-1}
http://liu400liu.iteye.com/blog/1197466
参考文章：
http://1194867672-qq-com.iteye.com/blog/1945827
本文出自 “点滴积累” 博客，请务必保留此出处http://tianxingzhe.blog.51cto.com/3390077/1682600