< p:schedule>在存在jQuery的情况下不显示 [英] <p:schedule> doesn't display in the presence of jquery
问题描述
我正在尝试在xhtml页面上显示素数计划，但这不起作用. 如此问题中所述，我消除了使用Ajax和i的组件.注意到那个 当我评论引用jquery文件的链接时，将显示计划表，它可以正常工作，但是其他jquery当然停止工作，并且我还遇到了以下JS错误:
I'm trying to display a primefaces schedule on a xhtml page but this doesn't work. As said in this question, i eliminated Components which uses Ajax and i noticed that when i commented the link referencing the jquery file the schedual is displayed and it works fine but of course other jquery stop to work and i also got the following JS error :
TypeError: b3 is undefined @ http://localhost:8080/theprojectname/javax.faces.resource/jquery/jquery.js.xhtml?ln=primefaces:14
当我取消注释jquery参考文件的链接时，计划表不显示，并且出现2个JS错误:
When i uncomment the link for the jquery reference file the schedual isn't displayed and i got 2 JS errors :
TypeError: this.jq.mask is not a function @ http://localhost:8080/theprojectname/javax.faces.resource/primefaces.js.xhtml?ln=primefaces:16
and :
TypeError: this.jqc.fullCalendar is not a function @ http://localhost:8080/theprojectname/javax.faces.resource/schedule/schedule.js.xhtml?ln=primefaces:1
这是在PF版本4.3.1和5.3中发生的.
This have happened with the PF version 4.3.1 and the 5.3.
这是我的index.xhtml:
This is my index.xhtml :
<?xml version="1.0" encoding="ISO-8859-1" ?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:c="http://java.sun.com/jsp/jstl/core">
<h:head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<link rel="stylesheet" href="CSS/general.css" type="text/css" />
<link rel="stylesheet" href="CSS/jquery-ui-1.10.0.custom.min.css"
type="text/css" />
<!-- This is the jquery file reference link i've commented : -->
<!-- <script src="JS/jquery-1.8.3.js" /> -->
<script src="JS/jquery-ui-1.10.0.custom.js" />
<script src="JS/jquery.flip.js" />
<script src="JS/jquerygen.js" />
<title>my app</title>
<script>
//<![CDATA[
//]]>
</script>
</h:head>
<body>
<f:view>
<h:form id="form1">
<h:panelGroup id="windsarea" layout="block">
<h:panelGroup id="gesevntsincl" layout="block">
<p:growl id="messages" showDetail="true" />
<p:schedule id="schedule" value="#{scheduleController.eventModel}"
widgetVar="myschedule">
<p:ajax event="dateSelect"
listener="#{scheduleController.onDateSelect}"
update="eventDetails" oncomplete="eventDialog.show()" />
<p:ajax event="eventSelect"
listener="#{scheduleController.onEventSelect}"
update="eventDetails" oncomplete="eventDialog.show()" />
<p:ajax event="eventMove"
listener="#{scheduleController.onEventMove}" update="messages" />
<p:ajax event="eventResize"
listener="#{scheduleController.onEventResize}" update="messages" />
</p:schedule>
<p:dialog widgetVar="eventDialog" header="Event Details"
showEffect="clip" hideEffect="clip">
<h:panelGrid id="eventDetails" columns="2">
<h:outputLabel for="title" value="Title:" />
<p:inputText id="title" value="#{scheduleController.event.title}"
required="true" />
<h:outputLabel for="from" value="From:" />
<p:inputMask id="from"
value="#{scheduleController.event.startDate}" mask="99/99/9999">
<f:convertDateTime pattern="dd/MM/yyyy" />
</p:inputMask>
<h:outputLabel for="to" value="To:" />
<p:inputMask id="to" value="#{scheduleController.event.endDate}"
mask="99/99/9999">
<f:convertDateTime pattern="dd/MM/yyyy" />
</p:inputMask>
<h:outputLabel for="allDay" value="All Day:" />
<h:selectBooleanCheckbox id="allDay"
value="#{scheduleController.event.allDay}" />
<p:commandButton type="reset" value="Reset" />
<p:commandButton id="addButton" value="Save"
actionListener="#{scheduleController.addEvent}"
oncomplete="myschedule.update();eventDialog.hide();" />
</h:panelGrid>
</p:dialog>
</h:panelGroup>
</h:panelGroup>
<div id="tasksbar" />
<div id="startbutn" />
<h:panelGroup id="startmenudiv">
<h:panelGroup id="substartmenudiv" />
</h:panelGroup>
<div style="visibility: hidden;">
<BR />
<BR /> <BR /> <BR /> <BR /> <BR /> <BR /> <BR /> <BR /> <BR />
<BR /> <BR /> <BR />
<BR /> <BR /> <BR /> <BR />
<BR /> <BR /> <BR /> <BR />
<BR /> <BR /> <BR /> <BR /> <BR /> <BR /> <BR /> <BR /> <BR />
<BR /> <BR /> <BR />
<BR /> <BR /> <BR /> <BR />
<BR /> <BR /> <BR /> <BR />
<BR /> <BR /> <BR /> <BR /> <BR /> <BR /> <BR /> <BR /> <BR />
<BR /> <BR /> <BR />
<BR />
</div>
<div id="loginbackground" />
<div id="logindivflip">
<div id="logindiv">
<br />
<div class="hidden" style="font-weight: 900;">Welcome,please
authentificate :</div>
<br />
<div class="hidden">
<h:outputText value="login :" />
<h:inputText class="rounded" value="#{userBean.login}" />
</div>
<br /> <br />
<div class="hidden">
<h:outputText value="password :" />
<h:inputText class="rounded" value="#{userBean.pwd}" />
</div>
<br /> <br />
<div class="hidden">
<span class="ebbtn"> <a id="logsubmitbtn" href=""
title="Reset" onclick="">Submit <f:ajax event="click"
execute="@this" listener="#{userBean.verifierUserDsLdap}" />
</a> <a id="resetbtn" href="" title="Reset" onclick="">Reset</a>
</span>
</div>
</div>
<div id="loginphoto" />
</div>
<p:remoteCommand name="addNewWindow"
actionListener="#{userBean.addNewWindow}">
<f:param name="windowname" />
</p:remoteCommand>
<p:remoteCommand name="updatewinstylprops"
actionListener="#{userBean.updatewinstylprops}">
<f:param name="windowid" />
<f:param name="top" />
<f:param name="left" />
<f:param name="width" />
<f:param name="height" />
</p:remoteCommand>
</h:form>
</f:view>
</body>
</html>
请问有人有线索吗?
推荐答案
您不应在页面中包含其他jquery，因为它已经与primefcaes捆绑在一起了...
You should not include additionals jquerys into your pages, cause its already bundled with primefcaes...
此外，使用h:outputScript代替<script和h:outputStylesheet代替link
Also , use h:outputScript instead of <script and h:outputStylesheet instead of link
因此，您的js include应该如下所示(注意，我首先明确包含了与primefaces捆绑在一起的jquery
So your js include should look like this (notice that I first included explicitly the jquery bundled with primefaces
<h:head>
<h:outputScript library="primefaces" name="jquery/jquery.js" target="head" />
<h:outputScript name="JS/jquery.flip.js" target="head" />
<h:outputScript name="JS/jquerygen.js" target="head" />
将JS文件夹放置在WebContent文件夹的resources文件夹下
place you JS folder under the resources folder in your WebContent folder
您还应该阅读 查看全文
