PrimeFaces TypeError: PF (...) ist nicht definiert

Ich folgte dem DataTable Filter showcase von PrimeFaces auf meiner eigenen DataTable. Jedes Mal, wenn die "onkeyup" Ereignis eintritt erhalte ich einePrimeFaces TypeError: PF (...) ist nicht definiert

TypeError: PF(...) is undefined error in Firebug and a "Uncaught TypeError: Cannot read property 'filter' of undefined

in Chrome-Konsole. Die Filterung funktioniert nicht.

Hier ist meine XHTML-Seite:

<?xml version="1.0" encoding="UTF-8"?> 
<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"> 
    <h:head> 
     <h:title>List of User</h:title> 
    </h:head> 

    <h:body> 
     <h:form id="UserForm" name="UserRecords"> 
      <p:dataTable id="users" widgetVar="usersTable" var="user" value="#{userBean.users}" scrollable="false" frozenColumns="0" sortMode="multiple" stickyHeader="true" filteredValue="#{userBean.filteredUsers}"> 
       <f:facet name="header">User<p:inputText id="globalFilter" onkeyup="PF('usersTable').filter()" style="float:right" placeholder="Filter"/> 
        <p:commandButton id="toggler" type="button" style="float:right" value="Columns" icon="ui-icon-calculator"/> 
        <p:columnToggler datasource="users" trigger="toggler"/> 
        <p:commandButton id="optionsButton" value="Options" type="button" style="float:right"/> 
        <p:menu overlay="true" trigger="optionsButton" my="left top" at="left bottom"> 
         <p:submenu label="Export"> 
          <p:menuitem value="XLS"> 
           <p:dataExporter type="xls" target="users" fileName="users"/> 
          </p:menuitem> 
          <p:menuitem value="PDF"> 
           <p:dataExporter type="pdf" target="users" fileName="users"/> 
          </p:menuitem> 
          <p:menuitem value="CSV"> 
           <p:dataExporter type="csv" target="users" fileName="users"/> 
          </p:menuitem> 
          <p:menuitem value="XML"> 
           <p:dataExporter type="xml" target="users" fileName="users"/> 
          </p:menuitem> 
         </p:submenu> 
        </p:menu> 
       </f:facet> 
       <p:column disabledSection="false" colspan="1" exportable="true" filterBy="#{user.firstName}" filterMatchMode="startsWith" filterStyle="display:none; visibility:hidden;" filterable="true" headerText="FirstName" priority="0" rendered="true" resizable="true" rowspan="1" selectRow="true" sortable="true" toggleable="true" visible="true"> 
        <h:outputText value="#{user.firstName}"/> 
       </p:column> 
       <p:column disabledSection="false" colspan="1" exportable="true" filterBy="#{user.lastName}" filterMatchMode="startsWith" filterStyle="display:none; visibility:hidden;" filterable="true" headerText="LastName" priority="0" rendered="true" resizable="true" rowspan="1" selectRow="true" sortable="true" toggleable="true" visible="true"> 
        <h:outputText value="#{user.lastName}"/> 
       </p:column> 
       <p:column disabledSection="false" colspan="1" exportable="true" filterBy="#{user.username}" filterMatchMode="startsWith" filterStyle="display:none; visibility:hidden;" filterable="true" headerText="Username" priority="0" rendered="true" resizable="true" rowspan="1" selectRow="true" sortable="true" toggleable="true" visible="true"> 
        <h:outputText value="#{user.username}"/> 
       </p:column> 
       <p:column disabledSection="false" colspan="1" exportable="true" filterBy="#{user.password}" filterMatchMode="startsWith" filterStyle="display:none; visibility:hidden;" filterable="true" headerText="Password" priority="0" rendered="true" resizable="true" rowspan="1" selectRow="true" sortable="true" toggleable="true" visible="true"> 
        <h:outputText value="#{user.password}"/> 
       </p:column> 
       <p:column disabledSection="false" colspan="1" exportable="true" filterBy="#{user.id}" filterMatchMode="startsWith" filterStyle="display:none; visibility:hidden;" filterable="true" headerText="Id" priority="0" rendered="true" resizable="true" rowspan="1" selectRow="true" sortable="true" toggleable="true" visible="true"> 
        <h:outputText value="#{user.id}"/> 
       </p:column> 
       <p:column disabledSection="false" colspan="1" exportable="true" filterBy="#{user.createdOn}" filterMatchMode="startsWith" filterStyle="display:none; visibility:hidden;" filterable="true" headerText="CreatedOn" priority="0" rendered="true" resizable="true" rowspan="1" selectRow="true" sortable="true" toggleable="true" visible="true"> 
        <h:outputText value="#{user.createdOn}"/> 
       </p:column> 
       <p:column disabledSection="false" colspan="1" exportable="true" filterBy="#{user.lastModified}" filterMatchMode="startsWith" filterStyle="display:none; visibility:hidden;" filterable="true" headerText="LastModified" priority="0" rendered="true" resizable="true" rowspan="1" selectRow="true" sortable="true" toggleable="true" visible="true"> 
        <h:outputText value="#{user.lastModified}"/> 
       </p:column> 
      </p:dataTable> 
     </h:form> 
    </h:body> 
</html>

Ich PrimeFaces 5.2 mit Mojarra 2.2.8 und 2.2.10 JSF verwenden.

Quelle

2015-05-19 Sebastian Lang

Suchen Sie in der generierten HTML-Ausgabe. Welche Skripte gibt es in der ''? Zumindest deutet das Mischen von Mojarra 2.2.8 mit 2.2.10 nicht darauf hin, dass Ihr Laufzeitklassenpfad sauber und frei von Konflikten ist. Sind Sie absolut sicher, dass Sie nicht auch mehrere PrimeFaces-Versionen mischen? Das wäre eine wahrscheinliche Ursache. – BalusC

Danke, nachdem ich mir die eingesetzten Primefaces-Versionen näher angesehen habe, erkannte ich, dass 5.1 und 5.2 durch einige seltsame Umstände parallel eingesetzt wurden. Entfernen von 5.1 löste das Problem. –

Das kann passieren, wenn der Klassenpfad der Laufzeit für doppelte versionierte Bibliotheken fehlerhaft ist. Konflikte würden dann während des Klassenladens und der Ressourcenauflösung auftreten.

Stellen Sie sicher, dass Sie nur eine Version einer Bibliothek verwenden. Dies gilt nicht nur für PrimeFaces, sondern auch für Mojarra. Mit 2.2.8 und 2.2.10 ist definitiv nicht richtig.

Quelle

2015-05-19 14:18:51 BalusC

In meinem Fall fand ich, dass meine TypeError: PF(...) is undefined Fehler verursacht wurden von Primefaces nicht wegen eines Schreibfehlers bieng kann das Widget widgetVar="usersTable" zum Beispiel finden

In diesem Fall wird die Konsolenausgabe direkt über dem Fehler in Firebug gibt Ihnen die Erklärung Widget for var 'editExecContactDialogg' not available!

Quelle

2015-05-26 06:51:09 hendinas

Wie @hendinas 'Antwort, dies ist nicht die Lösung für das spezielle Problem, aber könnte für zukünftige Googler, die den gleichen Fehler haben, aber mit einer anderen Ursache hilfreich sein.

Dies ist ein weiterer Fall von @hendinas' Antwort, aber wo das, was Sie sich beziehen müssen, wird nicht gefunden , weil es nicht die gleichen Bedingungen rendered hat. Hier ist ein Beispiel.

<ui:repeat id="extSyses" var="extSys" value="${cc.attrs.externalSystems}" 
     varStatus="extSysLoop"> 
    <h:commandButton 
     id="YesButton" value="Yes" type="button" 
     rendered='#{(rptBean.canEditReport or rptBean.canAnnotateReport) and not extSys.closed)}' 
     onclick="PF('#{cc.attrs.prefix}yesDlg#{extSysLoop.index}').show()" /> 

    <p:dialog id="extDocDlg" header='Enter document reference number' 
     rendered='#{rptBean.canEditReport and not extSys.closed)}' 
     widgetVar="#{cc.attrs.prefix}yesDlg#{extSysLoop.index}" 
     width="650" minWidth="650" modal="true"> 
     ... Dialog Content ... 
    </p:dialog> 
</ui:repeat>

In diesem Fall entsprach die widgetVar den Wert onclick, so dass gut war. Jedoch unterschied sich die rendered Klausel. Wenn canEditReport wahr ist, dann hat alles gut funktioniert. Wenn jedoch canAnnotateReport wahr ist, würde der Button erscheinen, aber es hätte keinen Dialog zur Anzeige! Wenn auf die Schaltfläche geklickt wird, wird die Nachricht TypeError: PF(…) is undefined angezeigt.

In diesem Beispiel besteht die Lösung darin, die rendered-Klauseln für die Schaltfläche und den Dialog, auf den sie sich bezieht, gleich zu machen.

Quelle

2015-09-29 18:56:51 Pixelstix

PrimeFaces TypeError: PF (...) ist nicht definiert

Antwort

Verwandte Themen