简体   繁体   English

未从p:confirmDialog中的基础窗口中删除模态

[英]Modality not removed from underlying window in p:confirmDialog

I'm using a PrimeFaces "global" <p:confirmDialog> and using the p:Confirm tag to call it for commandButton press with PrimeFaces version 5 我正在使用PrimeFaces“ global” <p:confirmDialog>并使用p:Confirm标记对PrimeFaces版本5的commandButton按下进行调用

When "yes" or "no" is pressed on the confirm dialog, the dialog disappears, but the underlying panel is not active (ie the modality is not turned off). 当在确认对话框上按下“是”或“否”时,该对话框消失,但基础面板未激活(即,模式未关闭)。 The action is being successfully concluded on the server though (on "yes"), and the data is properly updated - the only issue is that the panel isn't active. 但是,该操作已在服务器上成功完成(“是”),并且数据已正确更新-唯一的问题是面板未处于活动状态。

Here is my relevant code: 这是我的相关代码:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<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:ui="http://java.sun.com/jsf/facelets"
    xmlns:t="http://myfaces.apache.org/tomahawk"
    xmlns:p="http://primefaces.org/ui"
    xmlns:pt="http://xmlns.jcp.org/jsf/passthrough" 
    xmlns:cust="http://memarden.com">

<link href="CSS/navigation.css" rel="stylesheet" type="text/css" />

<h:body>
    <h3>#{text['organization']}</h3>
    <ui:composition template="template-restricted.xhtml">
        <ui:define name="body_content">
            <h:form id="mainForm">
                <div id="title" class="sl-title">Manage Schools - #{manageOrgHierarchy.selectedOrganization.displayString}</div>
                <div class="sr-content">
                <div class="ui-grid ui-grid-responsive"><div class="ui-grid-row">
                <div class="ui-grid-col-4"><p:panel layout="block">
                <p:toolbar><f:facet name="left">
                    <p:commandButton  
                        title="New Root Org"
                        icon="fa fa-folder-open" 
                        rendered="#{userSession.isAdmin}"
                        process="@form"
                        update="@form"
                        action="#{manageOrgHierarchy.createNewRootOrg}" />
                    <p:commandButton      
                        title="#{text['new.item']}"
                        icon="fa fa-folder-open" 
                        process="@form"
                        update="@form"
                        action="#{manageOrgHierarchy.createNewSubOrg}" />
                    <p:commandButton      
                        title="#{text['delete']}"
                        icon="fa fa-trash"
                        process="@form"
                        update="@form"
                        disabled="#{not manageOrgHierarchy.canBeDeleted}"
                        action="#{manageOrgHierarchy.delete}" />
                    <p:commandButton      
                        title="#{text['save']}"
                        icon="fa fa-save" 
                        process="@form"
                        update="@form"
                        action="#{manageOrgHierarchy.save}" />
                </f:facet></p:toolbar>
                <p:tree
                        id="orgTree"
                        value="#{manageOrgHierarchy.rootNodes}"
                        selectionMode="single"
                        selection="#{manageOrgHierarchy.selectedNode}"
                        style="ui-grid-col-2"
                        var="node">
                    <p:ajax event="select" update="mainForm" listener="#{manageOrgHierarchy.nodeSelected}" />
                    <p:ajax event="unselect" update="mainForm" listener="#{manageOrgHierarchy.nodeUnselected}" />
                    <p:ajax event="expand" listener="#{manageOrgHierarchy.nodeExpanded}" />
                    <p:ajax event="collapse" listener="#{manageOrgHierarchy.nodeCollapsed}" />
                    <p:treeNode type="OrganizationHierarchy">
                        <h:outputText value="#{node.nickName}" />
                    </p:treeNode>
                </p:tree></p:panel>
            </div>
            <div class="ui-grid-col-8">
            <p:tabView>
                <p:tab id="userTab" title="#{text['users']}">
                    <p:commandButton
                        id="addUserButton"
                        value="#{text['addUser']}"
                        icon="fa fa-user"
                        process="userTab"
                        update="userTab"
                        type="button" />
                    <p:overlayPanel
                        id="addUserPanel"
                        for="addUserButton"
                        dynamic="false" >
                        <p:panelGrid columns="2">
                            <p:inputText id="userSearch" value="#{manageOrgHierarchy.searchUser.searchKey}" />
                            <p:commandButton      
                                title="#{text['search']}"
                                icon="fa fa-search"
                                process="@form"
                                update="@form"
                                action="#{manageOrgHierarchy.searchUser.update}" />
                        </p:panelGrid>
                        <p:dataList
                            value="#{manageOrgHierarchy.searchUser.results}"
                            var="user"
                            type="definition" 
                            paginator="true" 
                            rows="10" 
                            styleClass="paginated">
                            <p:commandLink 
                                title="#{text['select']}"
                                process="@form"
                                update="@form"
                                action="#{manageOrgHierarchy.addUser(user)}"
                                styleClass="fa fa-check"/>
                            <h:outputText value=" #{text['name']}: #{user.nickName} ; #{text['username']}: #{user.name}" />
                        </p:dataList>
                    </p:overlayPanel>
                    <p:accordionPanel id="userDisplayPanel" value="#{manageOrgHierarchy.userPermissions}" var="p">
                    <p:tab title="#{p.user.displayString}">
                    <p:panelGrid columns="2" layout="grid" columnClasses="ui-grid-col-4,ui-grid-col-8">
                        <div class="userIcon.img"><cust:avatarOutput owner="#{p.user}" session="#{userSession}" /></div>
                        <p:panelGrid columns="2">
                            <h:outputText value="#{text['name']}: " /><h:outputText value="#{p.user.displayString}" />
                            <h:outputText value="#{text['username']}: " /><h:outputText value="#{p.user.name}" />
                            <h:outputText value="#{text['admin']}" /><h:selectBooleanCheckbox value="#{p.userManagementPermissions}" />
                            <h:outputText value="#{text['teacher']}" /><h:selectBooleanCheckbox value="#{p.instructorPermissions}" />
                            <h:outputText value="#{text['observer']}" /><h:selectBooleanCheckbox value="#{p.observerPermissions}" />
                        </p:panelGrid>
                    </p:panelGrid>
                    <p:commandButton      
                        title="#{text['save']}"
                        icon="fa fa-save" 
                        process="@form"
                        update="@form"
                        action="#{manageOrgHierarchy.saveUserPermissions(p)}" />
                    <p:commandButton      
                        title="#{text['delete']}"
                        icon="fa fa-trash"
                        process="@form"
                        update="@form"
                        action="#{manageOrgHierarchy.deleteUserPermissions(p)}" >
                        <p:confirm 
                            header="#{text['confirm']}" 
                            message="#{text['confirm.sure']}" 
                            icon="fa fa-alert" />
                    </p:commandButton>
                    </p:tab>
                    </p:accordionPanel>
                </p:tab>
                <p:tab title="#{text['profile']}">
                <p:panelGrid columns="2" layout="grid">
                    <p:panelGrid columns="1" layout="grid">
                        <p:outputLabel for="name" value="#{text['name']}" />
                        <p:inputText id="name" value="#{manageOrgHierarchy.editOrg.nickName}" />
                    </p:panelGrid>
                    <p:panelGrid columns="1" layout="grid">
                        <p:outputLabel for="phone" value="#{text['phone']}" />
                        <p:inputText id="phone" value="#{manageOrgHierarchy.editOrg.phone}" />
                    </p:panelGrid>
                    <p:panelGrid columns="1" layout="grid">
                        <p:outputLabel for="address" value="#{text['address']}" />
                        <p:inputText id="address" value="#{manageOrgHierarchy.editOrg.address}" />
                    </p:panelGrid>
                    <p:panelGrid columns="1" layout="grid">
                        <p:outputLabel for="city" value="#{text['city']}" />
                        <p:inputText id="city" value="#{manageOrgHierarchy.editOrg.city}" />
                    </p:panelGrid>
                    <p:panelGrid columns="1" layout="grid">
                        <p:outputLabel for="state" value="#{text['state']}" />
                        <p:inputText id="state" value="#{manageOrgHierarchy.editOrg.state}" />
                    </p:panelGrid>
                    <p:panelGrid columns="1" layout="grid">
                        <p:outputLabel for="postalCode" value="#{text['post.code']}" />
                        <p:inputText id="postalCode" value="#{manageOrgHierarchy.editOrg.postalCode}" />
                    </p:panelGrid>
                    <p:panelGrid columns="1" layout="grid">
                        <p:outputLabel for="country" value="#{text['address.country']}" />
                        <p:inputText id="country" value="#{manageOrgHierarchy.editOrg.country}" />
                    </p:panelGrid>
                </p:panelGrid>
                <h:panelGroup>
                    <p:commandButton      
                        value="#{text['cancel']}"
                        icon="fa fa-trash"
                        process="@form"
                        update="@form"
                        action="#{manageOrgHierarchy.cancelEditOrg}" />
                    <p:commandButton      
                        value="#{text['save']}"
                        icon="fa fa-save" 
                        process="@form"
                        update="@form"
                        action="#{manageOrgHierarchy.saveEditOrg}" />
                </h:panelGroup>
                </p:tab>
                <p:tab title="#{text['lessons']}"></p:tab>
                <p:tab title="#{text['reports']}"></p:tab>
            </p:tabView></div></div></div>
            </div>
          </h:form>
        </ui:define>
    </ui:composition>
</h:body>
</html>

<p:confirmDialog
    global="true" 
    showEffect="fade"
    hideEffect="fade" >
    <p:commandButton
      value="Yes" 
      type="button" 
      styleClass="ui-confirmdialog-yes" 
      icon="ui-icon-check" />
    <p:commandButton
      value="No" 
      type="button" 
      styleClass="ui-confirmdialog-no" 
      icon="ui-icon-close" />
</p:confirmDialog>

Adding appendTo="@(body)" worked for me. 添加appendTo="@(body)"对我appendTo="@(body)" I was trying appendToBody="true" , which does not work in PrimeFaces 5 as described here in the Primefaces migration guide 我正在尝试appendToBody="true" ,这在PrimeFaces 5中不起作用,如Primefaces迁移指南中所述

This was also mentioned in another question as the third answer down - I missed it at first, and remembered it later. 这在另一个问题中也被提及为第三个答案-我一开始错过了,后来想起了。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM