您的位置：首页 > 编程语言 > Java开发

springmvc中以一个页面作为响应返回给ajax

2014-12-07 21:05 363 查看

springmvc配置这里不写了直接上代码

下面是jsp请求页面

<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<%-- ${pageContext.request.contextPath } --%>
<script type="text/javascript" src="<%=request.getContextPath() %>/resource/js/jquery-1.11.1.js"></script>
<title>Insert title here</title>

<style type="text/css">
#div1{
border: 1px solid gray;
text-align: center;
height: 600px;
width:400px;
margin:0 auto;
}
</style>

<script type="text/javascript">

function findUser() {
$.ajax({        //这是$.ajax()方法
type:"POST",
url:"/1206homework/find",
data: $('#myform').serialize(),//ajax提交表单
dataType:"html",//接受响应的数据类型，我的响应是一个页面，所以这里用“html”
success:function(data){
$('#mydiv').html(data);//我把响应的页面被放到一个div中显示

}
})
}
</script>
</head>
<body >
<div id="div1">
<form id="myform" method="post" action="/1206homework/find">
<input type="text" name="username" id="username" />
<input type="button" value="查询" onclick="findUser()" /><br/><br/>
</form>
<hr/>
<div id="mydiv"></div>
</div>
</body>
</html>

下面是处理请求的contoller

package com.leo.controller;

import java.util.List;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.servlet.ModelAndView;

import com.leo.entity.User;
import com.leo.service.UserServiece;

@Controller
public class MyController {
private UserServiece us;

public void setUs(UserServiece us) {
this.us = us;
}

@ResponseBody//作用是将返回的对象作为响应，发送给页面
@RequestMapping("/find")
public ModelAndView findUsers(String username,ModelAndView m){
setUs(new UserServiece());
List<User> users =  us.findUsers(username);
m.addObject("users", users);
m.setViewName("showUser");
return m;

}

}

showUser是一个页面，显示数据，（我要把这个页面作为响应，返回给发送请求的那ajax页面）

<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<%-- ${pageContext.request.contextPath } --%>
<script type="text/javascript" src="../resource/js/jquery-2.1.1.min.js"></script>
<title>Insert title here</title>

<style type="text/css">

table{
border: 1px solid gray;

}
td,th{
border:1px solid gray;
width: 60px;
}
</style>
</head>
<body >
<div >
<table  >
<tr>
<th>编号</th>
<th>姓名</th>
<th>年龄</th>
<th>地址</th>
</tr>
<c:forEach items="${users }" var="user">
<tr>
<td>${user.id }</td>
<td>${user.username }</td>
<td>${user.age }</td>
<td>${user.address }</td>
</tr>
</c:forEach>

</table>

</div>
</body>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航