问题描述：从A页面带参数跳转到B页面，B页面解析参数请求后台数据完成页面初始化
"<td><a href='project-base-edit.jsp?pid="+item.pid+"'>编辑</a> | <a href='project-base-look.jsp?id="+item.pid+"'>查看详情</a></td>"
在跳转过来的页面中打印window.location对象，发现我们要的东西在search这个里面
于是我们打印window.location.search就可以拿到？id=1
在通过截串和分割拿到id
截串：substr(1) 去掉问号
分割：split("=")
var id =window.location.search.substr(1).split("=")[1];
如果参数是中文
var content =decodeURI(window.location.search).substr(1).split("=")[1];
发送ajax请求，设置数据，给数据行加上相应的id
$.ajax({
type:'get',
url:'/pms/pro/detail/'+id,
success:function (msg) {
$("#pname").text(msg.pname);
$("#comname").text(msg.customer.comname);
$("#comper").text(msg.comper);
$("#ename").text(msg.employee.ename);
$("#empcount").text(msg.empcount);
$("#starttime").text(moment(msg.starttime).format("YYYY-MM-DD"));
$("#buildtime").text(moment(msg.buildtime).format("YYYY-MM-DD"));
$("#endtime").text(moment(msg.endtime).format("YYYY-MM-DD"));
$("#remark").text(msg.remark);
$("#level").text(msg.level);
$("#cost").text(msg.cost);
}
})
jquery中text和val的区别
text是给被选元素设置文本内容
val是设置被选元素的value值，并不是所有元素都有value值
后端代码
//查看详情
@RequestMapping(value = "/detail/{id}",method = RequestMethod.GET)
@ResponseBody
public Project projectDetail(@PathVariable("id") Integer pid){
Project project = projectService.projectDetail(pid);
return project;
}
public Project projectDetail(Integer pid) {
Project project = projectMapper.selectByPrimaryKey(pid);
Customer customer = customerMapper.selectByPrimaryKey(project.getComname());
project.setCustomer(customer);
Employee employee = employeeMapper.selectByPrimaryKey(project.getEmpFk());
project.setEmployee(employee);
return project;
}
前端页面完整代码
<%@ page language="java" pageEncoding="UTF-8" %>
<!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=gb2312">
<title>查看项目信息</title>
<link rel="stylesheet" type="text/css" href="skin/css/base.css">
<script type="text/javascript" src="static/js/jquery-3.4.1.min.js"></script>
<script src="https://cdn.bootcss.com/moment.js/2.24.0/moment.min.js"></script>
<script type="text/javascript" >
$(function () {
var id =window.location.search.substr(1).split("=")[1];
$.ajax({
type:'get',
url:'/pms/pro/detail/'+id,
success:function (msg) {
$("#pname").text(msg.pname);
$("#comname").text(msg.customer.comname);
$("#comper").text(msg.comper);
$("#ename").text(msg.employee.ename);
$("#empcount").text(msg.empcount);
$("#starttime").text(moment(msg.starttime).format("YYYY-MM-DD"));
$("#buildtime").text(moment(msg.buildtime).format("YYYY-MM-DD"));
$("#endtime").text(moment(msg.endtime).format("YYYY-MM-DD"));
$("#remark").text(msg.remark);
$("#level").text(msg.level);
$("#cost").text(msg.cost);
}
})
})
</script>
</head>
<body leftmargin="8" topmargin="8" background='skin/images/allbg.gif'>
<!-- 快速转换位置按钮 -->
<table width="98%" border="0" cellpadding="0" cellspacing="1" bgcolor="#D1DDAA" align="center">
<tr>
<td height="26" background="skin/images/newlinebg3.gif">
<table width="58%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>
当前位置:项目管理>>查看项目基本信息
</td>
</tr>
</table>
</td>
</tr>
</table>
<form name="form2">
<table width="98%" border="0" cellpadding="2" cellspacing="1" bgcolor="#D1DDAA" align="center"
style="margin-top:8px">
<tr bgcolor="#E7E7E7">
<td height="24" colspan="12" background="skin/images/tbg.gif"> 查看项目信息 </td>
</tr>
<tr>
<td align="right" bgcolor="#FAFAF1" height="22">项目名称：</td>
<td align='left' bgcolor="#FFFFFF" onMouseMove="javascript:this.bgColor='#FCFDEE';"
onMouseOut="javascript:this.bgColor='#FFFFFF';" height="22" id="pname">
</td>
<td align="right" bgcolor="#FAFAF1" height="22">客户公司名称：</td>
<td align='left' bgcolor="#FFFFFF" onMouseMove="javascript:this.bgColor='#FCFDEE';"
onMouseOut="javascript:this.bgColor='#FFFFFF';" height="22" id="comname">
</td>
</tr>
<tr>
<td align="right" bgcolor="#FAFAF1" height="22">客户方负责人：</td>
<td align='left' bgcolor="#FFFFFF" onMouseMove="javascript:this.bgColor='#FCFDEE';"
onMouseOut="javascript:this.bgColor='#FFFFFF';" height="22" id="comper">
</td>
<td align="right" bgcolor="#FAFAF1" height="22">项目经理：</td>
<td align='left' bgcolor="#FFFFFF" onMouseMove="javascript:this.bgColor='#FCFDEE';"
onMouseOut="javascript:this.bgColor='#FFFFFF';" height="22" id="ename">
</td>
</tr>
<tr>
<td align="right" bgcolor="#FAFAF1" height="22">开发人数：</td>
<td align='left' bgcolor="#FFFFFF" onMouseMove="javascript:this.bgColor='#FCFDEE';"
onMouseOut="javascript:this.bgColor='#FFFFFF';" height="22" id="empcount">
</td>
<td align="right" bgcolor="#FAFAF1" height="22">开始时间：</td>
<td align='left' bgcolor="#FFFFFF" onMouseMove="javascript:this.bgColor='#FCFDEE';"
onMouseOut="javascript:this.bgColor='#FFFFFF';" height="22" id="starttime">
</td>
</tr>
<tr>
<td align="right" bgcolor="#FAFAF1" height="22">立项时间：</td>
<td align='left' bgcolor="#FFFFFF" onMouseMove="javascript:this.bgColor='#FCFDEE';"
onMouseOut="javascript:this.bgColor='#FFFFFF';" height="22" id="buildtime">
</td>
<td align="right" bgcolor="#FAFAF1" height="22">预估成本：</td>
<td align='left' bgcolor="#FFFFFF" onMouseMove="javascript:this.bgColor='#FCFDEE';"
onMouseOut="javascript:this.bgColor='#FFFFFF';" height="22" id="cost">
</td>
</tr>
<tr>
<td align="right" bgcolor="#FAFAF1" height="22">级别：</td>
<td align='left' bgcolor="#FFFFFF" onMouseMove="javascript:this.bgColor='#FCFDEE';"
onMouseOut="javascript:this.bgColor='#FFFFFF';" height="22" id="level">
</td>
<td align="right" bgcolor="#FAFAF1" height="22">计划完成时间：</td>
<td align='left' bgcolor="#FFFFFF" onMouseMove="javascript:this.bgColor='#FCFDEE';"
onMouseOut="javascript:this.bgColor='#FFFFFF';" height="22" id="endtime">
</td>
</tr>
<tr>
<td align="right" bgcolor="#FAFAF1">备注：</td>
<td colspan=3 align='left' bgcolor="#FFFFFF" onMouseMove="javascript:this.bgColor='#FCFDEE';"
onMouseOut="javascript:this.bgColor='#FFFFFF';" id="remark">
</td>
</tr>
<tr bgcolor="#FAFAF1">
<td height="28" colspan=4 align=center>
<a href="project-base.jsp" class="coolbg">返回</a>
</td>
</tr>
</table>
</form>
</body>
</html>
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
