我在这里面临一个奇怪的问题。在我的页面中,我有两个outputPanel。在第一个内部,有一个日程表来显示我从数据库查询的事件。在另一个内部,有一个数据表显示相同的事件,就像另一种可视化方法一样。此外,还有一个selectOneRadio在两个outputPanel之间交替。问题是:加载页面时,完美地加载了默认的outputPanel(包含计划的那个)(SCREEN 1)。但是,当我将selectOneRadio替换为包含数据表的outputPanel然后又转回(SCREEN 2)时,outputPanel不会加载。当我单击页面上的任意位置时,浏览器的控制台将显示以下消息:

Uncaught TypeError: Cannot read property 'top' of undefined primefaces.js.xhtml:1
Uncaught TypeError: Cannot read property 'left' of undefined primefaces.js.xhtml:16


这是xhtml页面:

<!-- Painel de seleção do tipo de exibição -->
            <p:panelGrid columns="2"
                         styleClass="gridNoLine clearBelow">
                <p:selectOneRadio value="#{eventoBean.tipoExibicaoSelecionada}">
                    <p:ajax listener="#{eventoBean.onTipoExibicaoAlterada}"
                            update=":frmEventos:opCalendario :frmEventos:opTabela"/>
                    <f:selectItem itemValue="1" itemLabel="Exibir calendário"/>
                    <f:selectItem itemValue="2" itemLabel="Exibir tabela"/>
                </p:selectOneRadio>
            </p:panelGrid>

            <!-- Painel do Calendário -->
            <p:outputPanel id="opCalendario">
                <p:schedule id="sEventos"
                            value="#{eventoBean.customScheduleModel}"
                            widgetVar="schEventos"
                            locale="pt"
                            rendered="#{eventoBean.tipoExibicaoSelecionada == 1}">
                    <p:ajax event="eventSelect"
                            listener="#{eventoBean.onEventSelect}"
                            update=":frmDetalhesEvento"
                            immediate="true"
                            oncomplete="dlgDetalhesEvento.show();"/>
                    <p:ajax event="dateSelect"
                            listener="#{eventoBean.onDataSelecionada}"
                            update="@form :frmNovoEditarEvento"
                            oncomplete="dlgNovoEditarEvento.show();"/>
                </p:schedule>
            </p:outputPanel >

            <!-- Painel do DataTable -->
            <p:outputPanel id="opTabela">
                <p:dataTable
                    value="#{eventoBean.eventos}"
                    paginator="true" rows="5"
                    rowsPerPageTemplate="5,10"
                    paginatorPosition="bottom"
                    paginatorTemplate="{FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
                    var="evento"
                    rendered="#{eventoBean.tipoExibicaoSelecionada == 2}"
                    emptyMessage="Não há eventos para exibição">
                    <f:facet name="header">
                        Eventos
                    </f:facet>
                    <!-- Colunas de edição e exclusão -->
                    <p:column styleClass="commandColumn">
                        <f:facet name="header">
                            <h:outputLabel value="Editar"/>
                        </f:facet>
                        <p:commandButton image="ui-icon-pencil"
                                         title="Editar"
                                         update=":frmNovoEditarEvento:pNovoEditarEvento"
                                         oncomplete="dlgNovoEditarEvento.show();">
                            <f:setPropertyActionListener value="#{evento}"
                                                         target="#{eventoBean.eventoSelecionado}" />
                        </p:commandButton>
                    </p:column>
                    <p:column styleClass="commandColumn">
                        <f:facet name="header">
                            <h:outputLabel
                                value="Excluir"/>
                        </f:facet>
                        <p:commandButton id="cbViewExcluir"
                                         oncomplete="dlgExcluir.show();"
                                         icon="ui-icon-close"
                                         title="Excluir">
                            <f:setPropertyActionListener value="#{evento}"
                                                         target="#{eventoBean.eventoSelecionado}" />
                        </p:commandButton>
                    </p:column>
                    <p:column sortBy="#{evento.nmeEvento}"
                              styleClass="wrap tableTitleWidth">
                        <f:facet name="header">
                            Nome
                        </f:facet>
                        <p:panelGrid columns="1"
                                     styleClass="gridNoLine">
                            <h:outputLabel id="olViewNomeEvento"
                                           value="#{evento.nmeEvento}"
                                           styleClass="t2"/>
                            <p:panelGrid columns="4" styleClass="gridNoLine wrap">
                                <h:outputLabel value="Início: " styleClass="t3"/>&nbsp;
                                <h:outputLabel value="#{evento.dtaInicioEvento}"/>&nbsp;&nbsp;
                                <h:outputLabel value="Término: " styleClass="t3"/>&nbsp;
                                <h:outputLabel value="#{evento.dtaTerminoEvento}"/>&nbsp;
                            </p:panelGrid>
                            <p:separator title="Descrição do evento"/>
                            <h:outputLabel value="#{evento.dscEvento}"
                                           styleClass="wrap"/>
                            <p:panelGrid columns="4"
                                         styleClass="gridNoLine">
                                <p:commandButton value="Atividades"
                                                 styleClass="commandButton"
                                                 title="Gerenciar as atividades do evento."
                                                 action="atividades"/>
                                <p:commandButton value="Recursos"
                                                 styleClass="commandButton"
                                                 title="Alocar recursos para o evento."/>
                                <p:commandButton value="Serviços"
                                                 styleClass="commandButton"
                                                 title="Alocar serviços para o evento."/>
                                <p:commandButton value="Participantes"
                                                 styleClass="commandButton"
                                                 title="Gerenciar participantes do evento."/>
                            </p:panelGrid>
                        </p:panelGrid>
                    </p:column>
                </p:dataTable>
            </p:outputPanel>


这是我的豆子:

...

private int tipoExibicaoSelecionada = 1;

...

public void onTipoExibicaoAlterada() {
    if (tipoExibicaoSelecionada == 1) { // Exibir como calendario

        // Realizando a lógica de painéis
        exibirComoCalendario = true;
        exibirComoTabela = !exibirComoCalendario;

    } else { // Exibir como DataTable

        // Realizando a lógica de painéis
        exibirComoCalendario = false;
        exibirComoTabela = !exibirComoCalendario;

        if (eventos == null) {
            try {
                // Consultar os eventos para exibir no DataTable
                eventos = eventoService.consultarTodos();
            } catch (Exception e) {
            }
        }
    }
}

public void onEventSelect(ScheduleEntrySelectEvent entrySelectEvent) {

    try {
        // Transformando o evento para Pojo
        eventoSelecionado = ScheduleEventConverter.convertToEventoPojo(eventoService, entrySelectEvent.getScheduleEvent());
    } catch (Exception e) {
    }

}

public void onDataInicioAlterada(DateSelectEvent e) {
}

public void onDataTerminoAlterada(DateSelectEvent e) {
}

public void onDataSelecionada(DateSelectEvent e) {
    // Gerando um novo evento para ser preenchido
    eventoSelecionado = new TbEvento();

}

public void loadModel() {

    try {

        // Carregando o custom schedule model
        customScheduleModel = new CustomScheduleModel();

        // Carregando a lista de publicos
        publicos = publicoService.consultarTodos();

        // Carregando os tipos de eventos
        tiposEventos = tipoEventoService.consultarTodos();

    } catch (Exception e) {
    }
}


我正在使用以下Maven依赖项:

<dependency>
    <groupId>org.primefaces</groupId>
    <artifactId>primefaces</artifactId>
    <version>3.4.2</version>
</dependency>


屏幕1:



屏幕2:

最佳答案

尝试将<p:selectOneRadiop:ajax替换为<h:selectOneRadiof:ajax

我不是maven用户,请仔细检查您是否仅使用3.4.2,然后查看此线程... [PF 3.1 Snapshot] Dialog + OverlayPanel + SelectOneMenu JS E

08-17 13:27