1

我的按钮代码是:

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

我可以看到它调用了我的操作并且我的属性在后台是空的,但是我的表单输入没有被清理。它应该清理两个输入和一个表。桌子被清理了,但我的输入没有。

我已经搜索了一些没有运气的解决方案。

有什么不对?

我的弹出窗口有它自己的文件 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

感谢您更新您的帖子。我认为你有两个选择:

  • 在 popupPanel 内移动表单,或

  • 使用丰富: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。对话框占位符内的任何内容都是位置:相对,这意味着“我内部的所有定位元素都应该相对于我的位置定位”。

仅当 div 具有绝对位置并且不嵌套在具有绝对、相对或固定位置的任何标签内时,它才会相对于浏览器窗口定位。否则,它将相对于包含标签定位。

因此,为了实现相对于视口的定位,无论您将对话框(即 div)放在哪里,它都会被重新定位为主体的子项。因此,即使您的对话框在表单内,它也会被移到表单外。这就是为什么如果您想在其中包含按钮和链接,对话框必须具有自己的形式。

于 2012-08-21T07:49:20.847 回答