Primefaces 5.0 dialog widgetvar

dialog, jsf, primefaces

Solution

Primefaces already has a jQuery, so it's very recommended to not to use another jQuery lib while working with Primefaces.

Try to remove you external jQuery lib and call the dialog by the command PF('dlg').show();

You can check this and other changes in the migration guide at: https://code.google.com/p/primefaces/wiki/MigrationGuide

Problem

I am building website using primefaces 5 and wildfly server. I have a problem with using component. I have with in each row as follows. Button have defined actionlistener property that invokes backing bean method and after that it should display dialog. Here is some code: ``` <?xml version='1.0' encoding='UTF-8' ?> <!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://xmlns.jcp.org/jsf/facelets" xmlns:h="http://xmlns.jcp.org/jsf/html" xmlns:p="http://primefaces.org/ui" xmlns:pt="http://java.sun.com/jsf/composite/components" template="../templates/mainTemplate.xhtml"> <ui:define name="title"></ui:define> <ui:define name="main-content"> <h:form> <p:dataTable id="dataTable" value="#{bean.list}" var="item" styleClass="hide-column-header small-text"> <!-- some columns --> <p:column style="width: 18%; text-align: center;"> <p:commandButton value="Open dialog" actionListener="#{bean.buttonListener(item)}" oncomplete="PF('dlg').show();"/> </p:column> </p:dataTable> </h:form> <p:dialog id="dialog" widgetVar="dlg" resizable="false" modal="true" header="Dialog"> <h:form> <!-- some inputs --> </h:form> </p:dialog> </ui:define> </ui:composition> ``` But it is not working. I check chrome console and got message "Widget for var 'Widget for var 'dlg' not available!" when click on button so I checked 'Primefaces.widgets' and indeed there is no widget for my dialog. Can anyone help me with that? // edit Ok I finally get it to work. By trial and error i found this line in my template: ``` <script type="text/javascript" src="//code.jquery.com/jquery-2.1.1.min.js"></script> ``` After removing it everything started to work as planned. I think that it is because primefaces come with own version of jquery right?

Original source