JSF richfaces getElementById

Question

我正在使用jsf2和richfaces 4.X如何獲取啓用richfaces的輸入字段的當前值？等於getElementById（'field_name'）。vlue

我嘗試了一些像findcomponent.value和element.value這樣的方法，但是它們給了我加載頁面時的舊值b/c findcomponent和element方法返回server側UI.components而不是客戶端組件？

Answer 1

我想你會用rich:clientId函數來爲你的java腳本提供一個正確的標識符。

例如：

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

也RichFaces rich:clientId within facelets

Answer 2

看到，如果你檢查生成的HTML，你可以看到每一個JSF/RF元件都有自己的編號，如：。例如：

<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; 

此外，對於像rich:tab或RF複合HTML組件rich:calendar你可以使用由生成的HTML組件ID，但我會建議"#{rich:clientId('field_name')}"如@DRCB在他的崗位解釋。

Answer 3

要獲取richfaces組件值，請使用rich：component和getValue（）方法。
要獲取jsf庫組件值，請使用rich：元素和值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> 

他們倆甚至在豐富的工作：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>