“原始”对话框呈现两次 [英] Primefaces dialog is rendering twice
本文介绍了“原始”对话框呈现两次的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我已经创建了一个使用类似弹出窗口的ui：组件，因此我可以使用此模板的标准创建大量弹出窗口。
该组件只是一个带有两个按钮（取消和提交）的弹出窗口和可以覆盖的内容，就像您可以在这里看到的：
<！DOCTYPE html PUBLIC - // W3C // DTD XHTML 1.0 Transitional // ENhttp://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd >
< html xmlns =http://www.w3.org/1999/xhtml
xmlns：ui =http://java.sun.com/jsf/facelets
xmlns：h =http://java.sun.com/jsf/html
xmlns：c =http://java.sun.com/jsp/jstl/core
xmlns ：f =http://java.sun.com/jsf/core
xmlns：p =http://primefaces.prime.com.tr/ui>
< ui：component>
< p：dialog widgetVar =＃{idPopup}id =＃{idPopup}modal =＃{popup.modal}
draggable =＃{popup.modal}
rendered =＃{popup.visivel}visible =＃{popup.visivel}
closeOnEscape =falseclosable =falseheader =＃{titulo}
可调整大小=falsestyleClass =autoWidthDialogshowEffect =fade
hideEffect =fade>
< h：panelGroup style =width：100％>
< p：focus />
< ui：insert name =conteudo> Nenhumconteúdodefinido！< / ui：insert>
< h：panelGrid id =＃{idPopup} PainelMensagensstyle =width：100％>
< p：messages />
< / h：panelGrid>
< ui：insert name =barraDeBotoes>
< h：panelGroup layout =blockstyle =width：100％>
< p：commandButton value =CANCELARimmediate =trueupdate =@ form
style =float：rightaction =＃{controladorPopup.fechar}
的onclick = ＃{idPopup} .hide（）; />
< p：commandButton value =OKstyle =float：right
update =@ form formAlerta
action =＃{controladorPopup.submit}
process =@ form/>
< / h：panelGroup>
< / ui：insert>
< / h：panelGroup>
< / p：dialog>
< / ui：component>
< / html>
当我尝试提交表单而不填写必填字段时，会出现问题。正确的行为只是再次弹出弹出消息，但对话框呈现两次，一个带有消息，一个没有消息。
您可以在此处看到此行为：
这是这个模板的一个用途：
< ui：composition template =../ templates / popupSubmit.xhtml>
< ui：param name =titulovalue =Buscar pessoa/>
< ui：param name =popupvalue =＃{modeloPopupBuscaPessoa}/>
< ui：param name =controladorPopup
value =＃{controladorPopupBuscaPessoa}/>
< ui：define name =conteudo>
< h：panelGroup>
< h：panelGrid columns =2>
< h：outputLabel value =Tipo de cadastro：style =float：none/>
< h：selectOneMenu value =＃{controladorSugestaoPessoa.tipoCadastro}
immediate =true>
< f：selectItems value =＃{carregadorTipoCadastro.itens}/>
< f：ajax event =changeimmediate =true/>
< / h：selectOneMenu>
< / h：panelGrid>
< h：outputText value =Buscar por por：/>
< h：selectOneRadio value =＃{controladorSugestaoPessoa.tipoBusca}
immediate =true>
< f：selectItems value =＃{carregadorTipoBuscaPessoa.itens}/>
< f：ajax event =changeimmediate =true/>
< / h：selectOneRadio>
< p：autoComplete value =＃{modeloPopupBuscaPessoa.itemSelecionado}
forceSelection =truemaxResults =10queryDelay =500
completeMethod =＃{controladorSugestaoPessoa.atualizarSugestoes $
var =pessoaitemLabel =＃{pessoa.label}itemValue =＃{pessoa}
converter =＃{conversorSelectItem}/>
< / h：panelGroup>
< / ui：define>
< / ui：composition>
这些是有用的：
< h：form id =cadastroPessoa>
< ui：include
src =resources / components / popups / modulo_cadastro / popupNovoCadastroPessoa.xhtml>
< ui：param name =idPopupvalue =popupNovoCadastroPessoa//>
< / ui：include>
< ui：include
src =resources / components / popups / modulo_cadastro / popupCadastroPessoa.xhtml>
< ui：param name =idPopupvalue =popupEdicaoCadastroPessoa/>
< / ui：include>
< ui：include
src =resources / components / popups / modulo_cadastro / popupBuscaPessoa.xhtml>
< ui：param name =idPopupvalue =popupBuscaCadastroPessoa/>
< / ui：include>
< / h：form>
< h：form id =cadastroProduto>
< ui：include
src =resources / components / popups / modulo_cadastro / popupCadastroProduto.xhtml>
< ui：param name =idPopupvalue =popupNovoCadastroProduto/>
< / ui：include>
< / h：form>
有人可以告诉我为什么会发生这种情况吗？
解决方案
在我的情况下，我无法使用oncompleteI）方法隐藏对话框，因为它必须关闭一些业务逻辑。
我的情况我已经在UI上使用了原子标签。每次我导航选项卡，然后单击出现对话框的按钮，我的对话框编号正在增加相称性
所以我已经使用简单的jQuery脚本从UI
e UI中删除所有的复制对话框。 p>
function removeDuplicateDialogs（dialogId）{
\\一般我们所有的组件都有：我们必须
\\将'：'替换为'\\：'（应用转义字符）
dialogId = dialogId.replace（/ \：/ g，'\\：'） ;
var dialogs = jQuery（div [id =+ dialogId +]）;
var numOfDialogs = dialogs.length;
numOfDialogs = numOfDialogs - 1; （var i = 0; i< numOfDialogs; i ++）
{
jQuery（dialogs [i]）。
}
}
I've created an ui:component to use like a popup, so I can create a lot of popups using the standard of this template. The component is just a popup with two buttons (cancel and submit) and a content that can be overriden, like you can see here:
<!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:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:c="http://java.sun.com/jsp/jstl/core"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.prime.com.tr/ui">
<ui:component>
<p:dialog widgetVar="#{idPopup}" id="#{idPopup}" modal="#{popup.modal}"
draggable="#{popup.modal}"
rendered="#{popup.visivel}" visible="#{popup.visivel}"
closeOnEscape="false" closable="false" header="#{titulo}"
resizable="false" styleClass="autoWidthDialog" showEffect="fade"
hideEffect="fade">
<h:panelGroup style="width:100%">
<p:focus />
<ui:insert name="conteudo">Nenhum conteúdo definido!</ui:insert>
<h:panelGrid id="#{idPopup}PainelMensagens" style="width:100%">
<p:messages />
</h:panelGrid>
<ui:insert name="barraDeBotoes">
<h:panelGroup layout="block" style="width:100%">
<p:commandButton value="CANCELAR" immediate="true" update="@form"
style="float:right" action="#{controladorPopup.fechar}"
onclick="#{idPopup}.hide();" />
<p:commandButton value="OK" style="float:right"
update="@form formAlerta"
action="#{controladorPopup.submit}"
process="@form" />
</h:panelGroup>
</ui:insert>
</h:panelGroup>
</p:dialog>
</ui:component>
</html>
The problem happen when I try to submit the form without filling the required fields. The correct behavior is just show again the popup with messages, but the dialog is rendered twice, one with the messages and one without the messages. You can see this behavior here:
this is one use of this template:
<ui:composition template="../templates/popupSubmit.xhtml">
<ui:param name="titulo" value="Buscar pessoa" />
<ui:param name="popup" value="#{modeloPopupBuscaPessoa}" />
<ui:param name="controladorPopup"
value="#{controladorPopupBuscaPessoa}" />
<ui:define name="conteudo">
<h:panelGroup>
<h:panelGrid columns="2">
<h:outputLabel value="Tipo de cadastro:" style="float:none" />
<h:selectOneMenu value="#{controladorSugestaoPessoa.tipoCadastro}"
immediate="true">
<f:selectItems value="#{carregadorTipoCadastro.itens}" />
<f:ajax event="change" immediate="true" />
</h:selectOneMenu>
</h:panelGrid>
<h:outputText value="Buscar por:" />
<h:selectOneRadio value="#{controladorSugestaoPessoa.tipoBusca}"
immediate="true">
<f:selectItems value="#{carregadorTipoBuscaPessoa.itens}" />
<f:ajax event="change" immediate="true" />
</h:selectOneRadio>
<p:autoComplete value="#{modeloPopupBuscaPessoa.itemSelecionado}"
forceSelection="true" maxResults="10" queryDelay="500"
completeMethod="#{controladorSugestaoPessoa.atualizarSugestoes}"
var="pessoa" itemLabel="#{pessoa.label}" itemValue="#{pessoa}"
converter="#{conversorSelectItem}" />
</h:panelGroup>
</ui:define>
</ui:composition>
And these are some use:
<h:form id="cadastroPessoa">
<ui:include
src="resources/components/popups/modulo_cadastro/popupNovoCadastroPessoa.xhtml">
<ui:param name="idPopup" value="popupNovoCadastroPessoa" />
</ui:include>
<ui:include
src="resources/components/popups/modulo_cadastro/popupCadastroPessoa.xhtml">
<ui:param name="idPopup" value="popupEdicaoCadastroPessoa" />
</ui:include>
<ui:include
src="resources/components/popups/modulo_cadastro/popupBuscaPessoa.xhtml">
<ui:param name="idPopup" value="popupBuscaCadastroPessoa" />
</ui:include>
</h:form>
<h:form id="cadastroProduto">
<ui:include
src="resources/components/popups/modulo_cadastro/popupCadastroProduto.xhtml">
<ui:param name="idPopup" value="popupNovoCadastroProduto" />
</ui:include>
</h:form>
Could someone tell me why this is happening??
解决方案
In my case I cannot user oncompleteI) method to hide the dialog because it has to be closed to some business logic.
I my case I have use primefaces tabs on UI. Every time I navigate the tabs and then click on button on which dialog appears then my dialogs number are increasing proportionality So I have used simple jquery script to remove all the duplication dialog from the UI e UI.
function removeDuplicateDialogs(dialogId) {
\\ generally all our components have : character we have to
\\ replace ':' with '\\:'(applying escape character)
dialogId = dialogId.replace(/\:/g, '\\:');
var dialogs = jQuery("div[id=" + dialogId + "]");
var numOfDialogs = dialogs.length;
numOfDialogs = numOfDialogs - 1;
for (var i = 0; i < numOfDialogs; i++) {
jQuery(dialogs[i]).remove();
}
}
这篇关于“原始”对话框呈现两次的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
