2010-12-15 41 views
1

在我的項目中,我使用外部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> 

+0

因爲我不知道JSP。以我的理解,請更改jquery聲明如下。 – 2010-12-15 09:35:21

+0

您是否收到任何錯誤?請檢查螢火蟲... – Vivek 2010-12-15 09:42:17

+0

向我們展示您的jQuery代碼,以便我們分析出錯的原因? – Vivek 2010-12-15 09:53:44

回答

0
$.noConflict(); 
       jQuery(document).ready(function($){ 
//Give ur jquery codes here 

}); 
+0

@Mohan Ram我認爲jquery聲明沒有錯...... – Vivek 2010-12-15 09:41:19

+0

我也在使用高圖。首先,我遇到了很多問題。我的錯誤是$ .conflict()中的錯誤聲明。所以我建議你。 – 2010-12-15 09:43:24

+0

感謝您的回覆。我測試了以下方法:1.使用您的代碼。但沒有迴應。 2.我只是加載該插件。不能訪問該查詢。儘管我有同樣的問題。 – Eswar 2010-12-15 09:46:59

相關問題