1

私のボタンコードは次のとおりです。

<h:commandButton value="Clean" action="#{facesBean.cleanFilter()}" >
    <f:ajax execute="@form" render="result id name"/>
</h:commandButton>

アクションを呼び出し、backbeanのプロパティが空であることがわかりますが、フォーム入力がクリーンアップされません。2つの入力と1つのテーブルをクリーンアップする必要があります。テーブルはクリーンアップされますが、私の入力はクリーンアップされません。

私は運がないいくつかの解決策を探しました。

何か問題がありますか？

私のポップアップには独自のファイルpopup.xhtmlがあり、ui：includeを介して使用します。ポップアップのコードは次のとおりです。

<h:form id="userForm">
    <rich:popupPanel id="popup-user" modal="true" headerClass="popup-header" styleClass="popup" domElementAttachment="form" keepVisualState="true" width="620" autosized="true" top="50">
        <f:facet name="header" >
            <h:outputText value="Search User" />
        </f:facet>
        <f:facet name="controls">
            <h:commandLink>
                <h:graphicImage url="/images/icon-close.png" alt="Close" styleClass="icone-close"/>
                <rich:componentControl target="popup-user" operation="hide" />
            </h:commandLink>
        </f:facet>

        <fieldset>
            <legend class="section">Search User Filter</legend>
            <h:panelGrid styleClass="form" columns="1" cellspacing="0" columnClasses="item">
                <h:panelGroup>
                    <h:outputLabel styleClass="label-form" value="ID" for="id" />
                    <br />
                    <h:inputText id="id" value="#{facesBean.filter.id}" styleClass="textfield" maxlength="8"/>
                </h:panelGroup>
                <h:panelGroup>
                    <h:outputLabel styleClass="label-form" value="Name" for="name" />
                    <br />
                    <h:inputText id="name" value="#{facesBean.filter.name}" styleClass="textfield" />
                </h:panelGroup>
            </h:panelGrid>
        </fieldset>

        <div id="buttons">
            <h:commandButton value="Search" action="#{facesBean.search()}">
                <f:ajax execute="@form" render="result-users" />
            </h:commandButton>
            <h:commandButton value="Clean" action="#{facesBean.clean()}" >
                <f:ajax execute="@form" render="id name result-user"/>
            </h:commandButton> 
        </div>      

        <h:panelGroup id="result-user">
                <rich:dataScroller for="userTable" styleClass="pagination" maxPages="5" boundaryControls="hide" renderIfSinglePage="false" fastControls="hide" stepControls="auto" execute="@form" render="userTable" />
                <rich:dataTable id="userTable" value="#{facesBean.list}" var="user" style="width:600px;" rows="10">
                    <f:facet name="header">
                        <rich:columnGroup>
                            <rich:column styleClass="left" style="width: 5%">
                                <h:outputText value="Action" />
                            </rich:column>
                            <rich:column styleClass="left" style="width: 10%">
                                <h:outputText value="ID" />
                            </rich:column>
                            <rich:column styleClass="left" style="width: 25%">
                                <h:outputText value="Name" />
                            </rich:column>
                            <rich:column styleClass="left" style="width: 25%">
                                <h:outputText value="E-mail" />
                            </rich:column>
                        </rich:columnGroup>
                    </f:facet>

                    <rich:columnGroup>
                        <rich:column>
                            <h:commandButton image="/images/icon-select.png" alt="Select" actionListener="#{mainBean.selectUser(user)}" styleClass="icon-select">
                                <f:ajax execute="@form" render=":form:#{field}" />
                                <rich:componentControl target="popup-user" operation="hide" />
                            </h:commandButton>
                        </rich:column>
                        <rich:column>
                            <h:outputText value="#{user.id}" />
                        </rich:column>
                        <rich:column>
                            <h:outputText value="#{user.name}" />
                        </rich:column>
                        <rich:column>
                            <h:outputText value="#{user.email}" />
                        </rich:column>
                    </rich:columnGroup>
                </rich:dataTable>
            </h:panelGroup>
        </h:panelGroup>
    </rich:popupPanel>
</h:form>
4

2 に答える 2

1

非常に多くのことを試した後、入力をaの間に入れてボタンを変更しようとしたところ、うまくいきました。

次のようになります。

    <a4j:outputPanel id="search-filter">
     <fieldset>
        <legend class="section">Search User Filter</legend>
        <h:panelGrid styleClass="form" columns="1" cellspacing="0" columnClasses="item">
            <h:panelGroup>
                <h:outputLabel styleClass="label-form" value="ID" for="id" />
                <br />
                <h:inputText id="id" value="#{facesBean.filter.id}" styleClass="textfield" maxlength="8"/>
            </h:panelGroup>
            <h:panelGroup>
                <h:outputLabel styleClass="label-form" value="Name" for="name" />
                <br />
                <h:inputText id="name" value="#{facesBean.filter.name}" styleClass="textfield" />
            </h:panelGroup>
        </h:panelGrid>
    </fieldset>
    </a4j:outputPanel>
    <div id="buttons">
        <h:commandButton value="Search" action="#{facesBean.search()}">
            <f:ajax execute="@form" render="result-users" />
        </h:commandButton>
        <a4j:commandButton value="Clean" action="#{facesBean.clean()}" >
            <f:ajax execute="@form" render="search-filter result-user"/>
        </a4j:commandButton> 
    </div>
于 2012-08-21T19:49:26.610 に答える
0

投稿を更新していただきありがとうございます。次の 2 つのオプションがあると思います。

  • フォームを popupPanel 内に移動する、または

  • rich:popupPanel domElementAttachment="form" を使用 ...

どうしてこれなの？非常に紛らわしいことに、popupPanel は dom 内で h:body タグの子になるように移動されます。したがって、次の構造を記述します。

<h:body>
  <h:form id="userForm">
    <rich:popupPanel id="popup-user" ...>

これは次のようになります。

<body>
  <div id="popup-user"> ...
  <form id="userForm"> ... </form>

問題は、popup-user の内容がフォームに含まれていないことです。これが発生する理由は、ダイアログをビューポートに対して相対的に配置する必要があることと、css の操作が複雑であることです。これがなぜこのように機能するのかを調査する際に、私が自分自身のために書いたいくつかのメモを次に示します。

ダイアログは絶対配置を使用して、ダイアログをビューポートの中央に配置します。position: absolute、top: xxpx、left: xxpx、display: none または block を使用した単なる div です。ダイアログのプレースホルダー内のものはすべて position: relative です。つまり、「自分の内部に配置されたすべての要素は、自分の位置に対して相対的に配置する必要があります」。

div は、絶対位置があり、絶対位置、相対位置、または固定位置を持つタグ内にネストされていない場合にのみ、ブラウザー ウィンドウに対して相対的に配置されます。それ以外の場合は、それを含むタグに対して相対的に配置されます。

そのため、ダイアログ (つまり div) を配置する場所に関係なく、ビューポートに対する相対的な配置を実現するために、本体の子として再配置されます。したがって、ダイアログがフォーム内にある場合でも、フォームの外に移動します。これが、ダイアログ内にボタンとリンクを配置する場合、ダイアログに独自のフォームが必要な理由です。

于 2012-08-21T07:49:20.847 に答える