jsf - JSF Richfaces getElementById

Question

我正在使用 jsf2 和richfaces 4.X 如何获得启用了richfaces 的输入字段的当前值？等于 getElementById('field_name').vlue

我尝试了一些名为 findcomponent.value 和 element.value 的方法，但它们给了我旧值，这是在加载页面时 b/c findcomponent 和 element 方法返回服务器端 UI.components 而不是客户端组件？

Answer 1

我猜您将使用rich:clientId函数将正确的标识符呈现到您的 java 脚本中。

例如：

var myElement = document.getElementById("#{rich:clientId('field_name')}");

另见RichFaces rich:clientId 在 facelets 中

Answer 2

如果您检查生成的 HTML，您会看到每个 JSF/RF 元素都有他的 id，例如：。例如：

<h:form id="frmSample">
    <h:inputText id="txtSample" value="#{mybean.someTextValue}" />
</h:form>

生成的 HTML 将是：

<form method="POST">
    <input type="text" id="frmSample:txtSample" />
</form>

因此，在 JavaScript 中，您可以通过此 id 引用元素。

var txtValue = document.getElementById('frmSample:txtSample').value;

此外，对于 RF 复合 HTML 组件rich:tab，rich:calendar您可以使用 HTML 生成的组件 ID，但我会推荐"#{rich:clientId('field_name')}"@DRCB 在他的帖子中解释的那样。

Answer 3

要获取richfaces 组件值，请使用rich:component 和getValue() 方法。
要获取 jsf 库组件值，请使用 rich:element 和 value JS 方法。

例子：

<h:form>
     <h:inputText id="textField" value="#{bean.value1}" />
     <a4j:commandButton value="displayTextField" action="doSomething()"
       onclick="alert('v:'+ #{rich:element('textField')}.value); return true;" />

     <rich:inplaceInput id="richField" value="#{bean.value1}" />
     <a4j:commandButton value="displayRichField" action="doSomething()"
       onclick="alert('v:'+ #{rich:component('richField')}.getValue()); return true;" />
</h:form>

它们甚至都可以在 Rich:dataTable 中工作，而无需添加数据表的 id 或其他内容。Richfaces 非常聪明，可以找到“当前行”示例的 id：

<h:form>
     <rich:dataTable id="mydatatable" value="bean.findValues()" var="myvar">

         <rich:column>

              <h:inputText id="textField" value="#{myvar.text1}" />
              <a4j:commandButton value="displayTextField" action="doSomething()"
                   onclick="alert('v:'+ #{rich:element('textField')}.value); return true;" />
         </rich:column>

         <rich:column>

             <rich:inplaceInput id="richField" value="#{myvar.text2}" />
             <a4j:commandButton value="displayRichField" action="doSomething()"
                  onclick="alert('v:'+ #{rich:component('richField')}.getValue()); return true;" />
         </rich:column>

     </rich:dataTable>
</h:form>