與Primefaces（JSF）的Twitter Bootstrap

我試圖用Twitter Bootstrap 2.0.2（http://twitter.github.com/bootstrap）使用Primefaces 3.2（也許它與JSF相關）。與Primefaces（JSF）的Twitter Bootstrap

我已經加入到起動例子（http://twitter.github.com/bootstrap/examples/starter-template.html）下拉菜單中使用以下腳本在<h:head>：

<script src="/resources/js/bootstrap.js"></script> 
<script src="/resources/js/jquery-1.7.2.js"></script> 
<script src="/resources/js/bootstrap-dropdown.js"></script>

這工作的JSF頁面上很好，但如果我添加了一個簡單p:dataTable

<p:dataTable var="i" value="#{testBean.list}"> 
    <p:column> 
    <f:facet name="header"><h:outputText value="Item"/></f:facet> 
    <h:outputText value="#{i}"/> 
    </p:column> 
</p:dataTable>

下拉菜單不再工作。我想這是JavaScript相關的，但不知道在哪裏搜索這個錯誤。

來源

2012-04-18 Thor

你能否也請張貼相關的呈現HTML代碼。 – nfechner 2012-04-18 08:03:44

呈現的HTML代碼位於以下位置：http://pastebin.com/avpKPnai – Thor 2012-04-18 08:10:21

首先你更好的使用h:outputScript加載js文件的...

我認爲其原因primefaces jQuery和手動包括一個之間的衝突......

PrimeFaces 3.2自帶的jQuery 1.7。 1，所以...

從您的代碼

和作案刪除

<script src="/resources/js/jquery-1.7.2.js"></script> FY您包括以下列方式在<h:head>元素

<f:facet name="first"> 
    <h:outputScript library="js" name="bootstrap.js"/> 
</f:facet> 
<h:outputScript library="primefaces" name="jquery/jquery.js"/> 
<h:outputScript library="js" name="bootstrap-dropdown.js"/>

而且看看JQuery Conflicts with Primefaces?及相關resource ordering。

來源

2012-04-18 08:14:12 Daniel

下拉菜單仍不起作用。通過停用'p：dataTable'，它也不起作用。（我已經刪除了手冊''，可以嗎？）。 jQuery應該從Primefaces庫中加載，因爲它會被渲染：'

您將包含JQuery兩次（Primefaces自動導入）。刪除您的手動導入：

<script src="/erp/resources/js/jquery-1.7.2.js"></script>

和一切都應該工作。

來源

2012-04-18 08:21:16 nfechner

我可以驗證JQuery是由Primefaces在渲染輸出中導入的，但DropDown菜單無法正常工作。 – Thor 2012-04-18 08:31:15

有一個更簡單的方法來添加此主題。

如果您使用的是行家項目基地做：

添加依賴

<dependency> 
     <groupId>org.primefaces.themes</groupId> 
     <artifactId>all-themes</artifactId> 
     <version>1.0.9</version> 
    </dependency>

或者添加一個特定的主題依賴

在網站添加此。XML

<context-param> 
     <param-name>primefaces.THEME</param-name> 
     <param-value>bootstrap</param-value> 
    </context-param>

如果你不使用Maven，手動下載的jar並將其添加到您的類路徑：

http://repository.primefaces.org/org/primefaces/themes/

參考文獻：

來源

2013-03-22 15:19:44

相關問題

與Primefaces（JSF）的Twitter Bootstrap

回答

相關問題