Bloquear tela de fundo quando o <p:dialog do primefaces abrir com modal

Bom dia, quero saber se alguem sabe como bloquear a pagina quando um dialog modal é aberto, pois se a pagina é grande e já tem barra de rolagem e mesma pode ser “mexida” com o scroll do mouse, se alguem souber agradeço.

Até mais

já tentou desativar a barra de rolagem quando abre a dialog ?? acho que pode dar certo

dei uma pesquida em como faz isso usando jsf e não encontrei nada, tem ideia de como posso fazer isso ?

“não estou pedindo pronto, quero uma luz para aprender a fazer”

vlw pela ajuda

no evento da chamada da modal ou mesmo quando ela for iniciada vc manda retirar o scroll e quando fechar manda colocar de novo, se vc estiver usando o prime acho que faz sozinho

No primefaces o dialog modal=“true” isso é automatico, nao precisa fazer mais nada. O que esta acontecendo ?

o dialog abre normalmente com modal, mas consigo rola a pagina toda com o mouse, como se nao tivesse modal algum aberto

Poste o codigo da sua pagina xhtml onde esta o dialog por favor.

 <fieldset>
                                <legend>Autores do Acervo</legend>
                                <h:panelGrid id="panelAutoresL" columns="3" width="100%" style="text-align:left" >
                                    <p:dataTable id="tabelaacervoXautorLista" value="#{acervoJsfBean.acervoXautorLista}" var="item" emptyMessage="Nenhum registro encontrado.">
                                        <p:growl id="grow3" life="4000"/>
                                        <p:column headerText="Autores do Acervo" style="width: 100%">
                                            <h:outputText value="#{item.acxautautor.autDescricao}"/>  
                                        </p:column> 
                                        <p:column headerText="Código" style="width:06%">
                                            <h:outputText value="#{item.acxautautor.autCodigo}" />  
                                        </p:column> 
                                        <p:column headerText="Ação" style="width:06%">
                                            <p:commandLink value="Remover" disabled="#{!acervoJsfBean.adicionando}"  update="@form" action="#{acervoJsfBean.excluiObj(item)}">
                                                <p:collector value="#{item}"  
                                                             removeFrom="#{acervoJsfBean.acervoXautorLista}"/>  
                                            </p:commandLink>
                                        </p:column>
                                    </p:dataTable>
                                </h:panelGrid>
                                <p:commandButton id="AutoresBtn" disabled="#{!acervoJsfBean.adicionando}" value="Pesquisar Autor" onclick="autoresDialog.show()"  visivel="#{sec:ifAnyGranted('ADM')}" image="search"/>
                            </fieldset>
                            <br/>

Certo, pelo que me parece, seu p:dialog esta dentro de um fieldset, faz um teste, tira ele de dentro de tudo e coloca ele so no form. E tira tb o appendToBody

não resolveu ;s que estranho

Poste o codigo todo da pagina =D

Ai esta o codigo

[code]<?xml version="1.0" encoding="UTF-8"?>

                                    <p:dataTable id="tblAssuntosList"
                                                 value="#{assuntosJsfBean.assuntosList}" 
                                                 var="assunto" 
                                                 scrollable="true" liveScroll="false" scrollHeight="405"
                                                 scrollRows="30" emptyMessage="Nenhum registro encontrado." 
                                                 paginator="true" paginatorPosition="bottom"
                                                 rows="10" pageLinks="10" paginatorTemplate="{FirstPageLink} 
                                                 {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} 
                                                 Registros por página: {RowsPerPageDropdown}
                                                 Encontrados: #{assuntosJsfBean.assuntosList.rowCount}"
                                                 rowsPerPageTemplate="10,25,35,50" lazy="true">

                                        <p:column headerText="Código" sortBy="#{assunto.assCodigo}" width="60" resizable="true">
                                            #{assunto.assCodigo}  
                                        </p:column>              
                                        <p:column headerText="Descrição" sortBy="#{assunto.assDescricao}" width="220">
                                            #{assunto.assDescricao}  
                                        </p:column>

                                        <p:column headerText="Ação"  width="180">
                                            <p:commandButton update="@form" ajax="false" value="Adicionar Assunto" action="#{acervoJsfBean.reinitAssuntos()}" image="ok" >
                                                <f:setPropertyActionListener target="#{acervoJsfBean.acervoxassuntos.acxasCodacervo}" value="#{acervoJsfBean.crudObj}"/>
                                                <f:setPropertyActionListener target="#{acervoJsfBean.acervoxassuntos.acxasCodassunto}" value="#{assunto}"/>
                                                <p:collector value="#{acervoJsfBean.acervoxassuntos}" addTo="#{acervoJsfBean.acervoXassuntosLista}"></p:collector>
                                            </p:commandButton>
                                        </p:column>

                                    </p:dataTable>
                                    <br/>

                                    <p:commandButton id="AssuntosBtnFechar" value="Sair" onclick="assuntosDialog.hide()" image="exit"/> 
                                </p:panel>

                            </p:dialog>
                        </fieldset>
                        <fieldset>
                            <legend>Observações</legend> 
                            <h:panelGrid columns="3" width="100%" style="text-align:center">
                                <h:panelGrid columns="2" style=" text-align: center">
                                    <p:editor id="aceObs" value="#{acervoJsfBean.crudObj.aceObs}" disabled="#{!acervoJsfBean.adicionando}"/>
                                </h:panelGrid>
                            </h:panelGrid>
                            <h:outputLabel/>
                        </fieldset><br/>
                        <h:panelGrid columns="3">

                            <treap:btnCrudNovo bean="#{acervoJsfBean}" visivel="#{sec:ifAnyGranted('ADM')}" />
                            <treap:btnCrudSalvar bean="#{acervoJsfBean}"/>
                            <treap:btnCrudCancelar bean="#{acervoJsfBean}"/>
                        </h:panelGrid>
                    </p:tab>

                    <p:commandButton id="teste" value="Procura"/>
                    <p:tab disabled="false" title="Procura" id="tabList" >
                        <p:panel header="Filtros de Consulta" id="parametros" >
                            <p:growl id="growl" life="4000"/>
                            <table border="0" cellpadding="2" cellspacing="0" style="margin-right: 40px">
                                <h:panelGrid columns="2" width="100%">
                                    <h:panelGrid columns="2">
                                        <tr>
                                            <td align="right">Título da Obra:</td>
                                            <td>
                                                <p:inputText id="inputTitulo" size="35" onfocus="this.value='';" value="#{acervoJsfBean.aceTitulo}"/>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td align="right">Subtítulo:</td>
                                            <td>
                                                <p:inputText size="15" onkeypress="this.setDate(dayValue)" value="#{acervoJsfBean.aceSubtitulo}"/>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td align="right">ISBN:</td>
                                            <td>
                                                <p:inputText size="15" onfocus="this.value='';" value="#{acervoJsfBean.aceIsbn}"/>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td align="right">Localização:</td>
                                            <td><p:inputText size="15" onfocus="this.value='';" value="#{acervoJsfBean.aceLocalizacao}"/><br/></td>
                                        </tr>
                                    </h:panelGrid>
                                    <h:panelGrid columns="2" style="height: 100%; border-top: 0">   
                                        <tr><td align="right">Editora:</td><td>
                                                <p:selectOneMenu value="#{acervoJsfBean.aceeditora}">
                                                    <f:selectItem itemLabel="Todas as editoras" itemValue="#{null}"/>
                                                    <f:selectItems value="#{acervoJsfBean.editorasList}" var="e" itemLabel="#{e.ediDescricao}" itemValue="#{e.ediCodigo}"/>
                                                </p:selectOneMenu>
                                            </td></tr><tr>
                                            <td align="right">Idioma:</td><td>
                                                <p:selectOneMenu value="#{acervoJsfBean.aceidioma}"> 
                                                    <f:selectItem itemLabel="Todos os idiomas" itemValue="#{null}"/>
                                                    <f:selectItems value="#{acervoJsfBean.idiomaList}" var="i" itemLabel="#{i.idiDescricao}" itemValue="#{i.idiCodigo}"/>
                                                </p:selectOneMenu>
                                            </td></tr><tr>
                                            <td align="right" >Classificação:</td><td>
                                                <p:selectOneMenu value="#{acervoJsfBean.aceclass}"  caseSensitive="true"> 
                                                    <f:selectItem itemLabel="Todas as classificações" itemValue="#{null}"/>
                                                    <f:selectItems value="#{acervoJsfBean.classificacaoList}" var="c" itemLabel="#{c.clasDescricao}" itemValue="#{c.clasCodigo}"/>
                                                </p:selectOneMenu>
                                            </td></tr><tr>
                                            <td align="right">Tipo do Material:</td><td>
                                                <p:selectOneMenu value="#{acervoJsfBean.acetipomate}" style="alignment-adjust: central">
                                                    <f:selectItem itemLabel="Todas os materiais" itemValue="#{null}"/>
                                                    <f:selectItems value="#{acervoJsfBean.tipoMaterialList}" var="m" itemLabel="#{m.tipoDescricao}" itemValue="#{m.tipoCodigo}"/>
                                                </p:selectOneMenu>
                                            </td></tr>
                                    </h:panelGrid>
                                </h:panelGrid>
                                <td>

                                    <p:defaultCommand target="pesquisaGeral" />
                                    <p:commandButton id="pesquisaGeral" actionListener="#{acervoJsfBean.atualizar}" value="Consultar" update="tabela1" process="parametros" image="search"/>
                                    <treap:btnRelatorio metodo="#{acervoJsfBean.geraRelatorioAcervoPDF()}"/>
                                </td>     
                            </table>

                        </p:panel>
                        <br/>


                        <p:dataTable id="tabela1"
                                     value="#{acervoJsfBean.acervoList}"
                                     var="item"
                                     emptyMessage="Nenhum registro encontrado."
                                     paginator="true"
                                     paginatorPosition="bottom" rows="15"
                                     pageLinks="10"
                                     paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} 
                                     {PageLinks} {NextPageLink} {LastPageLink}
                                     Exibir: {RowsPerPageDropdown}
                                     Encontrados: #{acervoJsfBean.acervoList.rowCount}"
                                     rowsPerPageTemplate="15,25,35,50" lazy="true">

                            <p:column>
                                <p:rowToggler />
                            </p:column>
                            <p:column headerText="Código" style="width:07%">
                                <h:outputText value="#{item.aceCodigo}" />
                            </p:column>
                            <p:column headerText="Título" sortBy="#{item.aceTitulo}">
                                <h:outputText value="#{item.aceTitulo}"/>
                            </p:column>
                            <p:column headerText="Subtítulo">
                                <h:outputText value="#{item.aceSubtitulo}"/>
                            </p:column>
                            <p:column headerText="Data Criação" sortBy="#{item.aceDatacad}">
                                <h:outputText value="#{item.aceDatacad}"/>
                            </p:column>
                            <p:column headerText="Localização">
                                <h:outputText value="#{item.aceLocalizacao}"/>
                            </p:column>
                            <p:column headerText="Exemplares">
                                <h:outputText value="#{item.totalExemplares}"/>
                            </p:column>
                            <p:column headerText="Exemplares Disponíveis">
                                <h:outputText value="#{item.exemplaresDisponiveis}"/>
                            </p:column>
                            <p:column headerText="Exemplares Emprestados">
                                <h:outputText value="#{item.exemplaresEmprestados}"/>
                            </p:column>
                            <p:column headerText="Ações" style="width:06%">
                                <treap:btnCrudEditar id="botaoEditar" bean="#{acervoJsfBean}" visivel="#{sec:ifAnyGranted('ADM')}"/>
                                <treap:btnCrudExcluir bean="#{acervoJsfBean}" visivel="#{sec:ifAnyGranted('ADM')}"/>
                            </p:column>
                            <p:rowExpansion>
                                <p:dataTable id="exemplar_list" value="#{item.bibExemplarCollection}" 
                                             var="exemplar" emptyMessage="Nenhum exemplar encontrado.">
                                    <p:column headerText="Código" style="width: 07%">
                                        <h:outputText value="#{exemplar.exeCodigo}"/>
                                    </p:column>
                                    <p:column headerText="Biblioteca">
                                        <h:outputText value="#{exemplar.exebiblio.bibNomecomp}"/>
                                    </p:column>
                                    <p:column headerText="Número">
                                        <h:outputText value="#{exemplar.exeExemplar}"/>
                                    </p:column>
                                    <p:column headerText="Situação">
                                        <h:outputText value="#{exemplar.exeSituacaoCompleta}"/>
                                    </p:column>
                                </p:dataTable>
                            </p:rowExpansion>
                        </p:dataTable>
                    </p:tab>

                </p:tabView> 
            </ui:define>
        </ui:composition>
    </h:form>
</body>

[/code]

Cara, voce poe seus dialogs dentro de panelGrids e fieldSets, isso nao é certo, Dialogs voce so precisa por dentro de um h:form, somente isso ele ja funciona, ja vi problemas com dialog devido a isso. Tira todos os seus dialogs de dentro dessas tags, poe todos organizados la no topo, logo abaixo do h:form. Outra coisa, voce usa o do HTML, troque para <h:body>.

vou testar já posto os resultados :smiley: obrigado pela ajuda

Do not worry :D, to bem ocupado aqui, se nao ate copiava teu codigo e testava algo parecido.

[removido]

Olá amigo,

Já tentou usar esse cara aqui : http://www.primefaces.org/showcase/ui/blockUI.jsf … ele bloqueia o componente que vc quiser. Nesse exemplo ele está boqueando o componente com id “tree”, você pode inclusive bloquear o body.

<p:commandButton id=“pnlBtn” value=“Block Panel” type=“button” onclick=“bui.show()”/>
<p:commandButton id=“pnlBtn2” value=“Unblock Panel” type=“button” onclick=“bui.hide()”/>

<p:blockUI block="tree" widgetVar="bui"/>  

Espero ter ajudado,

Gustavo