首先-我是PrimeFaces的新手,我试图在另一个已经生成的对话框顶部显示警告对话框。
查看代码看起来像(简化):
<p:dialog id="userDialog" header="User Account" widgetVar="userDialogView" modal="true" resizable="true" closable="fasle" showHeader="true" height="400" width="880px">
<h:form id="dataDialogForm">
...
</h:form>
</p:dialog>
<p:dialog id="warnDialog" header="Warning!" widgetVar="warnDialog" modal="true" appendTo="@(body)" height="300px" width="600px" resizable="false">
<h:outputText value="You are trying to delete. Do you want to proceed? Yes/No" />
</p:dialog>
和warnDialog
的生成器控制器
RequestContext.getCurrentInstance().execute("showDialog('warnDialog')");
warnDialog
的生成正确,但是显示在userDialog
对话框下,而不是它的顶部。
应用正在使用PrimeFaces v6.0
org.primefaces.webapp.PostConstructApplicationEventListener.processEvent Running on PrimeFaces 6.0
编辑:
经过测试的confirmDialog
代码(经过简化)类似于:
<p:dialog id="userDialog" header="User Account" widgetVar="userDialogView" modal="true" resizable="true" closable="fasle" showHeader="true" height="400" width="880px">
<h:form id="dataDialogForm">
...
<p:confirmDialog widgetVar="warnDialog" header="Confirmation" severity="warn" modal="true" resizable="false" position="top,left">
<f:facet name="message">
You are trying to delete. Do you want to proceed?
</f:facet>
<p:commandButton value="Yes" type="button" styleClass="ui-confirmdialog-yes" icon="pi pi-check" />
<p:commandButton value="No" type="button" styleClass="ui-confirmdialog-no" icon="pi pi-times" />
</p:confirmDialog>
</h:form>
</p:dialog>
没有在userDialog
上产生阻塞叠加层,也没有定位在视口的左上角,也没有定位在触发confirmDialog
的元素上。
答案 0 :(得分:1)
我已经通过覆盖PrimeFaces CSS解决了我的问题,由于某些原因,该CSS在版本5.x和6.x中没有正确处理覆盖对话框(与普通jQuery UI或Bootstrap相比)。
我的解决方案如下:
QTextFragment
及其CSS:
<p:dialog id="userDialog" header="User Account" widgetVar="userDialogView" modal="true" resizable="true" closable="fasle" showHeader="true" height="400" width="880px">
<h:form id="dataDialogForm">
...
</h:form>
</p:dialog>
<p:dialog id="warnDialog" header="Warning!" widgetVar="warnDialog" modal="true" height="300px" width="600px" resizable="false" styleClass="dialogWarn-fix">
<h:outputText value="You are trying to delete. Do you want to proceed? Yes/No" />
</p:dialog>