[size=medium][b]我现在想做一个功能,就是在displaytag的“显示详情”这列,鼠标上移就显示相应productId对应产品的详细信息。
想在displaytag的“查看详情”这一列跳到js文件,该怎么写?和js文件中的这句话:var as = $("a[name=showProductDetail]");有关系吗?我想用a标签过去的。
我这样写能在js当中接收到productId的值吗? 发到对应的action里应该怎么接收呢?
返回的内容可以在对应的showProductInfo div块里显示吗?
新手, 没有什么分数了,还是想请讲的明白点。
jsp页面代码:[/b][/size]
[code="java"]<%@ page contentType="text/html; charset=utf-8" language="java"
import="java.sql.*" errorPage=""%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<%@ taglib prefix="display" uri="http://displaytag.sf.net"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort()
+ path + "/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
rel="stylesheet" />
当前招标项目详情
<script type="text/javascript" src="../jsx/dojo/dojo.js"
djConfig="parseOnLoad: true"></script>
<script type="text/javascript" src="../jsx/dijit/dijit.js"></script>
<script type="text/javascript" src="../jsx/jquery/jquery.min.js"></script>
<script type="text/javascript" src="../jsx/jquery/jquery.form.js"></script>
<script type="text/javascript" src="../js/productInfo.js"></script>
<link rel="stylesheet" type="text/css" href="css/base.css"></link>
<link rel="stylesheet" type="text/css" href="css/infoDiv.css"></link>
</head>
<body>
<div id="body">
<div id="info">
<!--客户当前招标项目详细资料-->
<display:table name="bidDetailList" id="bidDetail" pagesize="5"
requestURI="showBidAndTenderInfos.action?bidId=${bidDetail.bidId}">
<display:column property="bidId" title="招标项目编号" sortable="true" />
<display:column property="productId" title="产品编号" sortable="true" />
<display:column property="productNum" title="产品数量" sortable="true" />
<display:column title="查看详情">
</display:column>
</display:table>
<div id="showProductInfo">
正在载入产品信息...
</div>
</div>
</body>
[/code]
以下是productInfo.js:
[code="java"]$(document).ready(function () {
var infoNode = $("#showProductInfo");
var as = $("a[name=showProductDetail]");
infoNode.hide();
as.mouseover(function (event) {
var aNode = $(this);
var productId = aNode.attr("productId");
var myEvent = event || window.event;
infoNode.css("left", myEvent.clientX - 50 + "px").css("top", myEvent.clientY + 20 + "px");
var url = "showProductInfo.action?productId=" + productId;
$.get(url, null, function (data) {
infoNode.html(data);
infoNode.show();
});
});
as.mousemove(function (event) {
var myEvent = event || window.event;
infoNode.css("left", myEvent.clientX - 50 + "px").css("top", myEvent.clientY + 20 + "px");
});
as.mouseout(function () {
infoNode.hide();
});
});[/code]
action部分代码:
[code="java"]public String showProductInfo() throws Exception{
int productId=Integer.parseInt(request.getParameter("productId"));
this.productInfo = this.projectService.findProductInfobyProductId(productId);
StringBuilder result=new StringBuilder();
response.setContentType("text/html;charset=utf-8");
PrintWriter out=response.getWriter();
if (productInfo!= null) {
result.append("类型:"+productInfo.getType()+"<br>");
out.println(result);
}
else
{
out.println("wu");
}
return null;
}[/code]