rich：選擇下拉式跳轉到列表中當前選定的項目

Question

我們使用rich:select作爲我們的下拉式輸入。

<rich:select id="select" value="#{controller.attrs.value}" > 
     <f:selectItems value="#{controller.attrs.items}" var="foo" 
      itemValue="#{foo}" itemLabel="#{foo.bar}" /> 
     <f:ajax event="#{ajaxActionController.action}" render="input" />    
</rich:select> 

我們的問題是，當下拉觸發時，它總是從列表中的第一個元素開始。不過，我們希望它跳轉到當前選定項目的位置。

Answer 1

不可能通過常規手段，但這應該工作：

<rich:select id="select" onlistshow="L.scrollList()" onlistclick="L.saveId()"> 

...

L = window.L || {}; 

(function() {   
    id = 0;  

    L.saveId = function() { 
     id = #{ rich:component('select') }.list.index; 
    }; 

    L.scrollList = function() { 
     var list = #{ rich:component('select') }.list, 
      listDiv = $(#{ rich:component('select') }.popupList.popup).find(".rf-sel-lst-scrl"), 
      selectedDivPos = $(list.items[id]).position(); 

      listDiv.scrollTop(selectedDivPos.top - 7); 
    }; 

})(L); 

Answer 2

<h:inputHidden id="selectedId" value="#{controller.attrs.value}"/> 
<rich:select id="select" value="#{controller.attrs.value}" > 
    <f:selectItems value="#{controller.attrs.items}" var="foo" 
     itemValue="#{foo}" itemLabel="#{foo.bar}" /> 
    <f:ajax event="#{ajaxActionController.action}" render="selectedId input" />    

做一個<h:inputHidden/>和（在這個例子中selectedId）添加其ID到ajax的"render="，然後在新選擇的情況下，值將被更新。

現在，你可以得到<h:inputHidden/>在JavaScript中值（</rich:select>選定值）：

var selectedValue = document.getElementById('selectedId').value;