PrimeFaces对话框

时间:2016-11-23 12:40:45

标签: twitter-bootstrap jsf primefaces

请帮助我!我尝试显示primefaces对话框,但点击按钮后没有显示任何内容。注意到我在我的代码中使用了bootstrap,而我的IDE与JSF2.2一起使用。

<div class="panel-body">
<h:form id="roleform">
    <p:growl id="rolemsgs" showDetail="true" />
<p:dataTable id="basicDT" var="role" value="#{roleBean.listRole}">
    <f:facet name="header">Liste Role</f:facet>
    <p:column headerText="ID">
        <h:outputText value="#{role.idRole}" />
    </p:column>
    <p:column headerText="Nom Role">
        <h:outputText value="#{role.nomRole}" />
    </p:column>
    <p:column style="width:32px;text-align: center">
        <p:commandButton ajax="true" update=":roleform:dialogform:roleDetail" oncomplete="PF(roleDialog).show()" icon="ui-icon-search" title="View">            <f:setPropertyActionListener value="#{role}" target="#{roleBean.selectRole}" />
        </p:commandButton>
    </p:column>
</p:dataTable>

<p:dialog header="Role Info" widgetVar="roleDialog" modal="true" showEffect="fade" hideEffect="fade" resizable="false">
    <h:form id="dialogform">
        <p:outputPanel id="roleDetail" style="text-align:center;">
            <p:panelGrid  columns="2" columnClasses="label,value">
                <f:facet name="header">Infos Role</f:facet>
                <h:outputText value="ID :" />
                <h:outputText value="#{roleBean.selectRole.idRole}" />

                <h:outputText value="Nom Role :" />
                <h:outputText value="#{roleBean.selectRole.nomRole}" />
            </p:panelGrid>
        </p:outputPanel>
    </h:form>
</p:dialog>
</h:form>

2 个答案:

答案 0 :(得分:2)

尝试用单引号括起您的小部件名称

oncomplete="PF('roleDialog').show();"

同样在调试jsf和primefaces时,尝试使用浏览器检查器并检查控制台。通常,primefaces相关问题会在那里显示javascript错误。

答案 1 :(得分:0)

您应该处理按钮并添加引号。 ajax的默认值为true,因此您不必声明属性。

<p:commandButton process="@this" update=":roleform:dialogform:roleDetail" 
oncomplete="PF('roleDialog').show()" icon="ui-icon-search" value="View">
     <f:setPropertyActionListener value="#{role}" target="{roleBean.selectRole}" />
</p:commandButton>

http://www.primefaces.org/showcase/ui/button/commandButton.xhtml