popup - Richfaces 4 弹出编辑器问题

Question

Richfaces 4.2.2

我在 rich:datatable 中添加了一个按钮，该按钮会导致出现 rich:popup 面板。弹出面板包含 a<rich:editor/>和 2 <h:commandButton/>s

数据表中的按钮调用backing bean中的一个方法来设置要编辑的String，编辑器映射到这个属性——我知道按钮是在backing bean中设置String。

我还在<h:outputText/>弹出面板中添加了一个以显示要编辑的字符串的值

问题是：

1. 当编辑器显示时，在源按钮被按下几次以使其进入和退出源模式之前，无法使用编辑面板
2. 支持 bean 属性的值未显示在编辑器中
3. 映射到支持 bean 中的方法的 commandButton 不调用该方法
4. outputText 第一次显示正确的值，但是当使用数据表中的不同行时，它在后续使用弹出面板时不会改变

我尝试过以相同的形式和单独的形式使用弹出窗口和数据表，并在弹出面板内部和外部尝试了单独的形式

这是页面

    <h:html xmlns="http://www.w3c.org/1999/xhtml"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:a4j="http://richfaces.org/a4j"
      xmlns:rich="http://richfaces.org/rich">

 .
 .
 .
    <h:form id="blogForm" prependId="false">

      <rich:popupPanel  id="mp" minHeight="600" minWidth="450"  height="600" width="800" resizeable="true">
        <f:facet name="header">
            <h:outputText value="Modal Panel Title" />
        </f:facet>

        <rich:editor id="editor" toolbar="full" value="#{blogBean.currentEntry}" skin="office2003" viewMode="visual">
          <f:param name="auto_focus" value="editor" />
        </rich:editor>

        <h:outputText escape="false" value=")))#{blogBean.currentEntry}(((" />

        <h:commandButton value="Save" action="#{blogBean.save}">
          <rich:componentControl target="mp" operation="hide" />  
        </h:commandButton>
        <h:commandButton value="Cancel" >
          <rich:componentControl target="mp" operation="hide" />  
        </h:commandButton>
      </rich:popupPanel>


     <a4j:commandButton value="Add new post" rendered="true" >
       <rich:componentControl target="mp" operation="show" />
     </a4j:commandButton>

     <h:panelGrid columns="1">
       <a4j:outputPanel id="panel" layout="block">                
         <rich:dataTable value="#{blogBean.entries}" columns="1" var="entry" rows="20" id="repeat" >
                 <rich:column width="800">
                     <rich:panel>
                       <f:facet name="header">
                          <a4j:commandButton value="Edit" rendered="true" oncomplete="#{rich:component('mp')}.show()">
                            <f:setPropertyActionListener value="#{entry}" target="#{blogBean.currentEntry}" />
                          </a4j:commandButton>
                       </f:facet>
                       <h:outputText escape="false" value="#{entry}" />
                     </rich:panel>
             </rich:column>
         </rich:dataTable>            
       </a4j:outputPanel>            
    </h:panelGrid>   
    </h:form>
  </h:body>

</h:html>

Answer 1

(2) 和 (4) 很可能是因为您实际上并没有通过 ajax 更新它们的值。

1. 为您添加一个id属性，<h:outputText/>并将<rich:editor/>这些 id 包含在命令按钮的render属性中，如下所示：

     <a4j:commandButton value="Edit" render="editorId,outputTextId" rendered="true" oncomplete="#{rich:component('mp')}.show()">
       <f:setPropertyActionListener value="#{entry}" target="#{blogBean.currentEntry}" />
     </a4j:commandButton>
   

   还要摆脱您在 中的标记<h:outputText/>并删除该escape属性以确保不会导致编辑器阻塞。

2. 将您的托管 bean 设置@ViewScoped为让您高枕无忧。

3. 您<h:commandButton/>在弹出窗口中使用 a 。除非这是设计使然，否则您在此处的选择会适得其反，因为此命令按钮将触发完整的生命周期请求/回发，并且您嵌套在其中的所有 javascript 都没有实际意义。将这些更改为<a4j:commandButton/>s。从长远来看，我建议您从该表单中删除弹出窗口，并在弹出窗口中单独放置一个表单。如果这没有改变，请在此处发布您的编辑，让我们准确了解您的操作方式。

Answer 2

要修复第 (2) 点，请在示例中使用 domElementAttachment="parent"：