每次加載facelets組件時都調用javascript函數

Question

我已經創建了一個自定義的facelets組件，並且我需要根據它從bean中獲取的值在每次加載時爲組件設置一些值。我在組件中使用了window.onload函數，當頁面中只有一個組件時，它可以正常工作。但是當我在頁面中使用該組件或更多的組件時，只有第一個組件獲取其值集。我需要一個很好的方法來解決這個問題。

我XHTML是這樣

<ui:composition> 

    <f:subview id="#{id}"> 
     <div id="script" style="display: none;"> 
      <script type="text/javascript"> 
    //<![CDATA[ 

     window.onload = function() { 

      //this function manipulates the value from the bean 

      };   


     function processNepCal(){ 
        //this function is for processing the changed values 
     } 
     // ]]> 
    </script> 
     </div> 
     <rich:calendar datePattern="yyyy-MM-d" id="gregCal" 
      rendered="#{backingBean.dataSetParam.userSession.nepDate }" 
      value="#{value}" inputClass="#{empty styleClass ? '' : styleClass}" /> 
     <h:panelGroup 
      rendered="#{!backingBean.dataSetParam.userSession.nepDate}"> 

      <h:panelGrid columns="3"> 
       <rich:comboBox id="nepCalYear" styleClass="datecls" 
        defaultLabel="year" onchange="processNepCal()" width="53px" 
        readonly="true" directInputSuggestions="true"> 
        <f:selectItem itemLabel="2067" itemValue="2067" /> 
        <f:selectItem itemLabel="2068" itemValue="2068" /> 
        <f:selectItem itemLabel="2069" itemValue="2069" /> 
        <f:selectItem itemLabel="2070" itemValue="2070" /> 
       </rich:comboBox> 
       <rich:comboBox id="nepCalMonth" styleClass="datecls" 
        onchange="processNepCal()" width="65px" readonly="true" 
        defaultLabel="month" directInputSuggestions="true"> 
        <f:selectItem itemLabel="Baisakh" itemValue="Baisakh" /> 
        <f:selectItem itemLabel="Jestha" itemValue="Jestha" /> 
        <f:selectItem itemLabel="Ashad" itemValue="Ashad" /> 
        <f:selectItem itemLabel="Shrawan" itemValue="Shrawan" /> 
        <f:selectItem itemLabel="Bhadra" itemValue="Bhadra" /> 
        <f:selectItem itemLabel="Ahswin" itemValue="Ahswin" /> 
        <f:selectItem itemLabel="Kartik" itemValue="Kartik" /> 
        <f:selectItem itemLabel="Mangsir" itemValue="Mangsir" /> 
        <f:selectItem itemLabel="Paush" itemValue="Paush" /> 
        <f:selectItem itemLabel="Magh" itemValue="Magh" /> 
        <f:selectItem itemLabel="Falgun" itemValue="Falgun" /> 
        <f:selectItem itemLabel="Chaitra" itemValue="Chaitra" /> 
       </rich:comboBox> 

       <rich:comboBox id="nepCalDay" styleClass="datecls" 
        onchange="processNepCal()" width="43px" readonly="true" 
        defaultLabel="day" directInputSuggestions="true"> 
        <f:selectItem itemLabel="01" itemValue="01" /> 
        <f:selectItem itemLabel="02" itemValue="02" /> 
        <f:selectItem itemLabel="03" itemValue="03" /> 
        <f:selectItem itemLabel="04" itemValue="04" /> 
        <f:selectItem itemLabel="05" itemValue="05" /> 
        <f:selectItem itemLabel="06" itemValue="06" /> 
        <f:selectItem itemLabel="07" itemValue="07" /> 
        <f:selectItem itemLabel="08" itemValue="08" /> 
        <f:selectItem itemLabel="09" itemValue="09" /> 
        <f:selectItem itemLabel="10" itemValue="10" /> 
        <f:selectItem itemLabel="11" itemValue="11" /> 
        <f:selectItem itemLabel="12" itemValue="12" /> 
        <f:selectItem itemLabel="13" itemValue="13" /> 
        <f:selectItem itemLabel="14" itemValue="14" /> 
        <f:selectItem itemLabel="15" itemValue="15" /> 
        <f:selectItem itemLabel="16" itemValue="16" /> 
        <f:selectItem itemLabel="17" itemValue="17" /> 
        <f:selectItem itemLabel="18" itemValue="18" /> 
        <f:selectItem itemLabel="19" itemValue="19" /> 
        <f:selectItem itemLabel="20" itemValue="20" /> 
        <f:selectItem itemLabel="21" itemValue="21" /> 
        <f:selectItem itemLabel="22" itemValue="22" /> 
        <f:selectItem itemLabel="23" itemValue="23" /> 
        <f:selectItem itemLabel="24" itemValue="24" /> 
        <f:selectItem itemLabel="25" itemValue="25" /> 
        <f:selectItem itemLabel="26" itemValue="26" /> 
        <f:selectItem itemLabel="27" itemValue="27" /> 
        <f:selectItem itemLabel="28" itemValue="28" /> 
        <f:selectItem itemLabel="29" itemValue="29" /> 
        <f:selectItem itemLabel="30" itemValue="30" /> 
        <f:selectItem itemLabel="31" itemValue="31" /> 
        <f:selectItem itemLabel="32" itemValue="32" /> 

       </rich:comboBox> 
      </h:panelGrid> 

      <h:inputText id="nepCalVal" value="#{value}" 
       styleClass="#{empty styleClass ? '': styleClass}" 
       style="display:none;"> 
       <f:converter converterId="NepaliDateConverter"></f:converter> 
      </h:inputText> 
     </h:panelGroup> 
    </f:subview> 
</ui:composition> 

Answer 1

首先，你爲什麼不只是使用組件的value屬性的呢？

<x:someComponent value="#{bean.value}" /> 

在豆或有fullworthy Converter的幫助，而只是直接做，如果有必要的操作。

---

關於你的具體問題，每次你聲明window.onload = function() {}先前宣佈一個將覆蓋。窗口只能有一個onload函數。你基本上需要把它們全部放在相同的 onload函數中。

更好的方法是使用element.addEventListener代替。這裏有一個crossbrowsercompatible片段：

這樣就可以使用

addEvent(window, "load", function() { 
    // Do here your thing. 
});