JSF 2.0 和带有 Facelets 的 Primefaces [英] JSF 2.0 and Primefaces with Facelets
问题描述
我正在尝试将 primefaces 合并到我的 JSF 2.0 Web 项目中.
我最近从 facelets 1.x 更新到 2.0，并将 primefaces jar 添加到我的库文件夹中.一切都很好，除了我的模板结构方式与素面冲突.
我的 template.xhtml 看起来像这样:
<html xmlns="http://www.w3.org/1999/xhtml"xmlns:ui="http://java.sun.com/jsf/facelets"xmlns:h="http://java.sun.com/jsf/html"xmlns:f="http://java.sun.com/jsf/core"><h:头><title><ui:insert name="title">MILO</ui:insert></title>//CSS//js</h:head><h:body class="milo"><h:form styleClass="miloForm" enctype="multipart/form-data"><div id="容器"><ui:insert name="header"><ui:include src="/WEB-INF/templates/header.xhtml"/></ui:insert><ui:insert name="content"><!-- 包含您的内容文件或取消注释下面的包含并在此目录中创建 content.xhtml --></ui:insert><ui:insert name="footer"><ui:include src="/WEB-INF/templates/footer.xhtml"/></ui:insert></h:form></h:body>
我的index.xhtml 看起来是这样的:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"xmlns:ui="http://java.sun.com/jsf/facelets"xmlns:h="http://java.sun.com/jsf/html"xmlns:f="http://java.sun.com/jsf/core"xmlns:p="http://primefaces.org/ui"><ui:composition template="/WEB-INF/templates/base.xhtml"><ui:define name="content"><p:editor/></ui:define>一旦我有了这个，p:editor 就不会出现了.任何想法为什么?控制台不会向我显示任何警告/错误.
EDIT>>> 发现 JS 错误
在你的template.xhtml中，你需要replace 由 由
特别是 <h:body> 仅在您有带有 target="body" 的 元素的最底部.
更新您的具体问题是由手动加载的 jQuery 库和 PrimeFaces 自动包含的库中的冲突引起的.PrimeFaces 在幕后使用 jQuery 和 jQuery UI.如果您坚持使用 PrimeFaces，我建议您放弃手动加载的 jQuery 并改用 PrimeFaces 捆绑的 jQuery.为了覆盖不使用 PrimeFaces 组件的页面，您可以通过将以下行添加到 <h:head>:
<h:outputScript library="primefaces" name="jquery/jquery.js"/>I'm trying to incorporate primefaces into my JSF 2.0 web project.
I've recently updated from facelets 1.x to 2.0 and Added primefaces jar to my library folder. Everything is fine except, the way I have my templates structured has a conflict with the primefaces.
my template.xhtml looks like this:
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core">
<h:head>
<title><ui:insert name="title">MILO</ui:insert></title>
//Css
//js
</h:head>
<h:body class="milo">
<h:form styleClass="miloForm" enctype="multipart/form-data">
<div id="container">
<ui:insert name="header">
<ui:include src="/WEB-INF/templates/header.xhtml"/>
</ui:insert>
<ui:insert name="content">
<!-- include your content file or uncomment the include below and create content.xhtml in this directory -->
</ui:insert>
<ui:insert name="footer">
<ui:include src="/WEB-INF/templates/footer.xhtml"/>
</ui:insert> </div>
</h:form>
</h:body>
And my index.xhtml looked like this:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui">
<ui:composition template="/WEB-INF/templates/base.xhtml">
<ui:define name="content">
<p:editor/>
</ui:define>
Once I have this, the p:editor won't show up. any ideas why? the console won't show me any warnings/errors.
EDIT>>> Found JS Error
In your template.xhtml, you need to replace <head> by <h:head> and <body> by <h:body>. You shouldn't add another ones, that would only result in invalid HTML.
Particularly the <h:head> is mandatory as it allows component libraries like PrimeFaces to auto-include the necessary CSS/JS files by resource dependency injection. The <h:body> is only mandatory whenever you have <h:outputScript> elements with a target="body" so that they will be auto-relocated to the very bottom of the generated HTML <body> element.
Update your concrete problem is caused by a conflict in the manually loaded jQuery library and the one which is auto-included by PrimeFaces. PrimeFaces uses jQuery and jQuery UI under the covers. If you stick to using PrimeFaces, I'd recommend to drop the manually loaded jQuery and use the PrimeFaces-bundled one instead. To cover pages where you don't use PrimeFaces components as well, you can explicitly load PrimeFaces-bundled jQuery for every page by adding the following line to the <h:head>:
<h:outputScript library="primefaces" name="jquery/jquery.js" />
这篇关于JSF 2.0 和带有 Facelets 的 Primefaces的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
