0

サンプルアプリケーションでJSF（Mojara）とPrimefaces3.4を使用しています。ヘッダー（北）に1つの画像リンクがある画面にレイアウトを適用しています（クリックするとダイアログボックスが開きます）。

northheader.xhtml：

<h:body>    
        <h:form id="headerForm">    

        <p:panelGrid id="headerFormPanelGridID" style="align:left;border:0px>
                <p:row> 

            <p:column width="70">
    <p:commandLink onclick="dialogWidgetWar.show();"  title="SampleImg">
    <p:graphicImage value="../sampleimg.jpg" />
    </p:commandLink>
            </p:column> 


            </p:row> 


        </p:panelGrid>




    <p:dialog id="idInfo"  modal="true" widgetVar="dialogWidgetWar" header="Sample Layout" border="0" width="400"  height="100" resizable="true" >          
        <h:panelGrid id="sampleId" style="cellpadding" border="0" cellpadding="0" cellspacing="0" width="200">


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

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

レイアウト用

<html lang="en"
     xmlns="http://www.w3.org/1999/xhtml"
     xmlns:f="http://java.sun.com/jsf/core"
     xmlns:h="http://java.sun.com/jsf/html"
     xmlns:ui="http://java.sun.com/jsf/facelets"
     xmlns:p="http://primefaces.org/ui">
   <h:head>

    </h:head> 
    <h:body>    

        <p:layout fullPage="true">
            <p:layoutUnit position="north" size="100" resizable="false" closable="false" collapsible="false">
                     <ui:include src="../northheader.xhtml" /> 

            </p:layoutUnit>

            <p:layoutUnit position="west" size="200" resizable="false" closable="false" collapsible="false">

                    <ui:include src="../left.xhtml" />

             </p:layoutUnit>

            <p:layoutUnit position="center" size="200">

                <ui:insert name="pageContent"></ui:insert>
            </p:layoutUnit>

        </p:layout>

    </h:body>

</html>

レイアウトは正しく表示されていますが、northheader.xhtmlの[SampleImg]リンクをクリックすると、ダイアログボックス内に閉じるボタンを1つ追加して機能しなくても、開いてもダイアログを閉じることができonclick="dialogWidgetWar.hide()"ません。何も選べません。

誰かがここで私を助けることができますか、問題はどこにありますか？

4

3 に答える 3

2

p：dialog内にappendToBody="true"属性を追加します

<p:dialog id="idInfo"  modal="true" appendToBody="true" 
widgetVar="dialogWidgetWar" header="Sample Layout" border="0" width="400"  height="100" resizable="true" >
于 2012-09-16T20:04:35.657 に答える
1

p:dialogの内部を使用していp:layoutます。これは常に私の過去の経験に問題を引き起こしました。固溶体は、のp:dialog外側を配置することp:layoutです。使用ui:defineしているので、ui:insertこれは簡単ではないようですが、非常に簡単です。1つのJSFページで複数のui:define要素を定義できるため、「コンテンツ」と「ダイアログ」ui:insertおよびを定義できますui:define。

<p:layout>
    <p:layoutUnit ...
        <ui:insert name="content"/>
    </p:layoutUnit>
</p:layout>
<ui:insert name="dialogs"/>
于 2012-09-17T05:27:38.837 に答える
1

これを試してください、これはうまくいくはずです;

 <p:commandLink onclick="PrimeFaces.monitorDownload(hideStatus);"  title="SampleImg">

javaスクリプト;

    <script type="text/javascript">
            function showStatus() {
                dialogWidgetWar.show();
            }

            function hideStatus() {
                dialogWidgetWar.hide();
            }
        </script>
于 2012-09-19T07:55:53.003 に答える