在我的項目中,我使用外部jQuery來創建圖表。但使用jQuery之後,任何操作都不適用於我的項目。我在我的項目中加載了highChart piechart jquery。
儘管我使用jQuery.noConflict()。但沒用。我有兩個靜態頁面(parent.jsp,leftsidemenu.jsp)和一個動態包含頁面(rightside1.jsp,rightside2.jsp .....)。父母頁面有兩個部分(左邊和右邊)。richfaces頁面加載jquery插件時不工作
步驟1:i之後登錄,某些菜單顯示在左側和右側圖表在右側displying(該圖通過使用jQuery填充。)
步驟2:如果我點擊在萊夫特賽德菜單,然後在右側部分發生動態變化。
但我使用jQuery後,leftsidemenu行動是行不通的。
如果我點擊左側的任何菜單,那麼它不會去支持bean操作。
parent.jsp
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<%@ taglib uri="http://richfaces.org/a4j" prefix="a4j"%>
<%@ taglib uri="http://richfaces.org/rich" prefix="rich"%>
<html>
<f:view>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body id="parentBody">
<rich:page id="parentRichPage" sidebarPosition="left" sidebarWidth="260">
<f:facet name="sidebar">
<a4j:outputPanel id="sideBarOutputPanelId">
<!-- Left side menuse -->
<jsp:include page="leftsidemenu.jsp" flush="true" />
</a4j:outputPanel>
</f:facet>
<rich:layout>
<rich:layoutPanel position="center" width="70*">
<a4j:outputPanel id="rightSidePanelId">
<f:verbatim>
// Here dynamic include the page depend upon leftside menu clicked
<jsp:include page="${ParentBean.rightSidePage}" flush="true"/>
</f:verbatim>
</a4j:outputPanel>
</rich:layoutPanel>
</rich:layout>
</rich:page>
</body>
</f:view>
</html>
leftsidemenu.jsp
<rich:panelMenuGroup id="leftSideLink" label="leftside1">
<a4j:support action="#{LeftSideBean.showRightSidePieAction1}"
event="onclick"
reRender="rightSidePanelId"/>
<rich:panelMenuItem id="leftSide2">
<a4j:commandLink id="leftSideMenuLink2"
value="ShowPage2"
action="# {LeftSideBean.showRightSideAction2}"
reRender="rightSidePanelId"/>
</rich:panelMenuItem>
<rich:panelMenuItem id="leftSide3">
<a4j:commandLink id="leftSideMenuLink3"
value="ShowPage3"
action="# {LeftSideBean.showRightSideAction3}"
reRender="rightSidePanelId"/>
</rich:panelMenuItem>
rightside1.jsp
此頁面有使用jquery一個圖表。
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<%@ taglib uri="http://richfaces.org/a4j" prefix="a4j"%>
<%@ taglib uri="http://richfaces.org/rich" prefix="rich"%>
<f:subview id="rightSide1SubviewId">
<f:verbatim><html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<a4j:loadScript src="../../scripts/jquery-1.3.2.min.js"/>
<a4j:loadScript src="../../scripts/jquery.min.js"/>
<a4j:loadScript src="../../scripts/highcharts.js"/>
<script type="text/javascript">
jQuery.noConflict();
$(document).ready(function()
{
// Here i already wrote a script for loading chart.
});
</script>
</head>
<body>
</f:verbatim>
<a4j:outputPanel id="rightSideChartPanel">
<rich:simpleTogglePanel id="toggleId" switchType="client" label="Charte Management" >
<div id="container" style="width: 350px; height: 250px; margin: 0 auto"></div>
</rich:simpleTogglePanel>
</a4j:outputPanel>
<f:verbatim>
</body>
</f:verbatim>
</f:subview>
<f:verbatim>
因爲我不知道JSP。以我的理解,請更改jquery聲明如下。 – 2010-12-15 09:35:21
您是否收到任何錯誤?請檢查螢火蟲... – Vivek 2010-12-15 09:42:17
向我們展示您的jQuery代碼,以便我們分析出錯的原因? – Vivek 2010-12-15 09:53:44