下面是一个用jquery实现的Ajax局部刷新。
实现的功能是在文本框中输入用户名后,在下面的<div>中显示出数据库中该用户的所有信息
js代码:
jsp:
在servlet得到userName:String userName =request.getParameter("userName");
跳转到显示数据界面:
实现的功能是在文本框中输入用户名后,在下面的<div>中显示出数据库中该用户的所有信息
js代码:
<script type="text/javascript">
$(function() {
$("#Submit").click(function() {
$("#show").html("");
$.ajax({
type : "POST", //请求方式
url : "user.do?method=selectByUserName",
cache : false,
data : "userName=" + $("#userName").val(), //传参
dataType : "html", //返回值类型 使用json的话也可以,但是需要在JS中编写迭代的html代码,如果格式样式
success : function(data) {
$("#show").html(data);
}
});
});
});
</script>
jsp:
<label for="textfield">请查询你要修改的用户</label> <input
name="userName" type="text" id="userName" /> <label
for="Submit"></label> <input type="button" name="Submit"
value="查询" id="Submit" />
在servlet得到userName:String userName =request.getParameter("userName");
跳转到显示数据界面:
<c:forEach items="${userList}" var="user">
<tr>
<td height="26" align="center" bgcolor="#FFFFFF"><a href="#">${user.name}</a>
</td>
<td align="center" bgcolor="#FFFFFF">${user.department}</td>
<td align="center" bgcolor="#FFFFFF">${user.mail}</td>
<td align="center" bgcolor="#FFFFFF">13800000001</td>
<td align="center" bgcolor="#FFFFFF">111111</td>
<td align="center" bgcolor="#FFFFFF">2188</td>
<td align="center" bgcolor="#FFFFFF"><a
href="<%=path%>/user/addUser.jsp">修改</a>
</td>
</tr>
</c:forEach>