CODEWITHSUNDEEP
jsfprimefacesjsf-2
Lahzey
Lahzey

Reputation: 393

Uncaught ReferenceError: $ is not defined JSF Primefaces (h:head included)

I have a simple JSF page displaying a text editor from primefaces (Showcase).
However, the text editor is not displayed. When I inspect it (F12 in chrome), I see multiple errors, the first one is:

core.js.xhtml:2 Uncaught ReferenceError: $ is not defined
at Object.resolveUserAgent (core.js.xhtml:2)
at Object.init (core.js.xhtml:2)
at core.js.xhtml:2

The others are Uncaught TypeError: Cannot read property 'Tag from Primefaces' of undefined.



I read those questions: 1 / 2, but I do have a <h:head>.
What am I missing?

My page (index.xhtml):

<h:html xmlns="http://www.w3.org/1999/xhtml"
xmlns:b="http://bootsfaces.net/ui"
xmlns:p="http://primefaces.org/ui"  
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html">
<h:head>
    <h:outputStylesheet library="css" name="style.css"  />
    <h:outputScript library="js" name="script.js" />
</h:head>
<h:body>
    <p:textEditor value="#{textEditorController.text}" height="300" style="margin-bottom:10px"/>
    <p:commandButton value="Submit" action="#{textEditorController.submit}"/>
</h:body>
</h:html>

My web.xml:

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://xmlns.jcp.org/xml/ns/javaee" xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd" version="3.1">
  <display-name>MusiglabelWEB</display-name>
  <servlet>
    <servlet-name>Faces Servlet</servlet-name>
    <servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
    <load-on-startup>1</load-on-startup>
  </servlet>
  <servlet-mapping>
    <servlet-name>Faces Servlet</servlet-name>
    <url-pattern>*.xhtml</url-pattern>
  </servlet-mapping>
  <context-param>
    <param-name>javax.faces.PARTIAL_STATE_SAVING</param-name>
    <param-value>false</param-value>
  </context-param>
  <context-param>
    <param-name>facelets.SKIP_COMMENTS</param-name>
    <param-value>true</param-value>
  </context-param>
</web-app>

I use muliple projects (WEB, JPA, EJB, EAR), if that matters.

Included Libraries in WEB Project:

  • Primefaces 6.1 (Downloaded here)
  • Bootsfaces 1.1.1 (Downloaded here)

    Upvotes: 2

    Views: 4732

    • Answers (2)

    Toumi
    Toumi

    Reputation: 3155

    I got the same problem. solved with importing both jquery and jquery ui like following

    ...
    <h:head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
</h:head>
...

    Upvotes: -2

    Vsevolod Golovanov
    Vsevolod Golovanov

    Reputation: 4206

    This is a bug in PrimeFaces, I registered it here. It manifests when a p:textEditor is the first of PrimeFaces components in the final view.

    To work around the bug simply add some other component before it, you can make it not rendered, so it won't affect your page otherwise:

    <p:inputText rendered="false" />
<p:textEditor />

    Upvotes: 6

    Related Questions