Question

我正在使用JSF 2.1和PrimeFaces 3.0.M4。我想动态更改中心布局，而无需在点击树节点时重新加载主页面。

主页MainExplorer.xhtml的代码是：

<?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:p="http://primefaces.org/ui" 
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"> 
    <h:head>
        <title>XX</title>
    </h:head>
    <h:body>
        <p:layout fullPage="true">

            <p:layoutUnit position="north" size="100" header="Top" resizable="true" closable="false" collapsible="true">
                <h:outputText value="Top unit content." />
            </p:layoutUnit>

            <p:layoutUnit position="south" size="100" header="Bottom" resizable="true" closable="false" collapsible="true">
                <h:outputText value="South unit content." />
            </p:layoutUnit>
            <p:layoutUnit position="west" size="150" header="Left" resizable="true" closable="false" collapsible="true">
                <h:form id="form" style="width: 150;" >
                    <p:growl id="messages" showDetail="true" />
                    <p:tree value="#{treeBean.root}" var="node" dynamic="true" cache="false" selectionMode="single"  selection="#{treeBean.selectedNode}">
                        <p:ajax event="expand" update=":form:messages" listener="#{treeBean.onNodeExpand}" />
                        <p:ajax event="collapse" update=":form:messages" listener="#{treeBean.onNodeCollapse}" />
                        <p:ajax event="select" update=":form:messages" listener="#{treeBean.onNodeSelect}" />
                        <p:ajax event="unselect" update=":form:messages" listener="#{treeBean.onNodeUnselect}" />
                        <p:treeNode><h:outputText value="#{node}" /></p:treeNode>
                    </p:tree>

                </h:form>
            </p:layoutUnit>

            <p:layoutUnit position="center" header="Welcome : user name" resizable="true" closable="true" collapsible="true">

     </p:layoutUnit>
        </p:layout>         
    </h:body>
</html>

我想在点击树事件时打开一个新页面或（of？）diff-diff数据表。例如。 CallListPage.xhtml。我想在中心布局中打开此页面。中心布局可能会打开多个页面。

<?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:p="http://primefaces.org/ui" 
      xmlns:f="http://java.sun.com/jsf/core"> 
    <h:head>
<title>XX</title>
    </h:head>
    <h:body>
        <h:form id="usr1" title="Call List">
            <p:growl id="growl" showDetail="true"/>  
            <p:dataTable var="callRow" 
                         value="#{callList.callDataModel}" 
                         rowKey="#{callRow.contspecs}"
                         selection="#{callList.advCallMstrSelected}" selectionMode="single"
                         paginator="true" rows="5"
                         paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
                         >

                <p:ajax event="rowSelect" listener="#{callList.onRowSelect}" update=":usr1:display :usr1:growl" oncomplete="callDialog.show()" />
                <p:ajax event="rowUnselect" listener="#{callList.onRowUnselect}" update=":usr1:growl"/>
                <p:column><f:facet name="header">Specification</f:facet><h:outputText value="#{callRow.contspecs}"/></p:column>
                <p:column><f:facet name="header">Exchange</f:facet><h:outputText value="#{callRow.exchange}"/></p:column>
                <p:column><f:facet name="header">Symbol</f:facet><h:outputText value="#{callRow.symbol}"/></p:column>
                <p:column><f:facet name="header">Call</f:facet><h:outputText value="#{callRow.call_type}"/></p:column>
                <p:column><f:facet name="header">Trigger</f:facet><h:outputText value="#{callRow.trigger_price}"/></p:column>
                <p:column><f:facet name="header">CMP</f:facet><h:outputText value="#{callRow.ltp}"/></p:column>
                <p:column><f:facet name="header">SL</f:facet><h:outputText value="#{callRow.sl_price}"/></p:column>
                <p:column><f:facet name="header">1st Tgt.</f:facet><h:outputText value="#{callRow.tg_1}"/></p:column>
                <p:column><f:facet name="header">2nd Tgt.</f:facet><h:outputText value="#{callRow.tg_2}"/></p:column>
                <p:column><f:facet name="header">3rd Tgt.</f:facet><h:outputText value="#{callRow.tg_3}"/></p:column>
                <p:column><f:facet name="header">4th Tgt.</f:facet><h:outputText value="#{callRow.tg_4}"/></p:column>
                <p:column><f:facet name="header">Status</f:facet><h:outputText value="#{callRow.call_status}"/></p:column>
                <p:column><f:facet name="header">Call By</f:facet><h:outputText value="#{callRow.makerid}"/></p:column>
                <f:facet name="footer">
            <p:commandButton value="View"   update="usr1:display" oncomplete="carDialog.show()"/>
            </f:facet> 
            </p:dataTable>

            <p:dialog header="Call Detail" widgetVar="callDialog" resizable="false" modal="true"
                      showEffect="explode" hideEffect="explode">
                <h:panelGrid id="display" columns="2" cellpadding="4">
                    <h:outputText value="exchange" />
                    <h:outputText value="#{callList.advCallMstrSelected.exchange}" />
                    <h:outputText value="Valid Upto:" />
                    <h:outputText value="#{callList.advCallMstrSelected.valid_upto}" />
                    <h:outputText value="Offer at:" />
                    <h:outputText value="#{callList.advCallMstrSelected.call_price1}" />
                    <h:outputText value="Call Entry Time:" />
                    <h:outputText value="#{callList.advCallMstrSelected.call_entrytime}" />
                    <h:outputText value="Message Time:" />
                    <h:outputText value="#{callList.advCallMstrSelected.msg_genration_time}" />
                    <h:outputText value="1st Target Hit Time :" />
                    <h:outputText value="#{callList.advCallMstrSelected.tg_1_hit_time}" />
                    <h:outputText value="2nd Target Hit Time :" />
                    <h:outputText value="#{callList.advCallMstrSelected.tg_2_hit_time}" />
                    <h:outputText value="3rd Target Hit Time :" />
                    <h:outputText value="#{callList.advCallMstrSelected.tg_3_hit_time}" />
                    <h:outputText value="4th Target Hit Time :" />
                    <h:outputText value="#{callList.advCallMstrSelected.tg_4_hit_time}" />
                    <h:outputText value="Stop Loss Hit Time :" />
                    <h:outputText value="#{callList.advCallMstrSelected.sl_hit_time}" />
                    <h:outputText value="Call finish Time:" />
                    <h:outputText value="#{callList.advCallMstrSelected.call_close_time}" />
                    <h:outputText value="SMS to:" />
                    <h:outputText value="#{callList.advCallMstrSelected.sms_to_group}" />
                    <h:outputText value="Message Group:" />
                    <h:outputText value="#{callList.advCallMstrSelected.messagegroup}" />
                    <h:outputText value="SubScriber's Group:" />
                    <h:outputText value="#{callList.advCallMstrSelected.subscribersgroup}" />
                    <h:outputText value="Message Remarks:" />
                    <h:outputText value="#{callList.advCallMstrSelected.msg_remarks}" />


                </h:panelGrid>
            </p:dialog>

        </h:form>
    </h:body>
</html>

我该如何打开它？

Answer 1

通过更改线路完成!!

旧代码

<p:ajax event="select" update=":form:messages" listener="#{treeBean.onNodeSelect}" />
<p:ajax event="unselect" update=":form:messages" listener="#{treeBean.onNodeUnselect}" />

新代码

<p:ajax event="select" update=":formCenter:panelGroupCenter" listener="#{treeBean.onNodeSelect}" />
<p:ajax event="unselect" update=":formCenter:panelGroupCenter" listener="#{treeBean.onNodeUnselect}" />

中心布局使用此：

<p:layoutUnit id="cent" position="center" header="Welcome : user name" 
                          resizable="true" closable="true" collapsible="true">
                <h:form id="formCenter" style="text-align: center" >
                    <h:panelGroup id="panelGroupCenter">
                        <ui:include src="#{treeBean.openPage}.xhtml" />
                    </h:panelGroup>
                </h:form>
</p:layoutUnit>

使用树事件在中心布局中加载diff-diff数据表

1 个答案: