如何從控件B調用控件A的事件處理程序？

Question

我在我的XPage中有2個comboBoxes。組合A和組合B.組合A有一個事件處理程序onChange。當我更改組合B值時，我想調用組合A onChange事件，以便執行存在的代碼並避免將其複製到組合B事件中。

所以在組合B的onChange事件我要調用組合A的onChange事件

我不介意，如果我必須要改變康寶的值。事實上，我試圖用CSJS和SSJS來實現，但A的onChange事件並未觸發，但值已更改。

Answer 1

您可以在客戶端執行此操作。我正在使用從this answer下面的JS功能。

// itemId : ID of an element 
// eventName: The name of the event (change, click, etc.) 
function fireEvent(itemId, eventName) { 
    var item=dojo.byId(itemId); 

    if(item) { 
     if (dojo.isIE) { 
      // IE does things differently 
      item.fireEvent("on"+eventName); 
     } 
     else { 
      // Not IE 
      var event = document.createEvent("HTMLEvents"); 
      event.initEvent(eventName, false, true); // Last two arguments: bubbles, cancelable 
      item.dispatchEvent(event); 
     } 
    } else { 
     console.log("'"+itemId+"' does not exist!");  
     // Item does not exist! 
    } 
} 

然而，XPages有一個棘手的部分。如果你的組合框觸發了一個服務器端事件，你應該在onComplete中調用這個函數。否則，你可以放一個客戶端腳本。例如：

<xp:comboBox 
    id="targetComboBox" 
    value="#{viewScope.TargetCombo}"> 
<!-- Some select items here --> 
</xp:comboBox> 

<xp:comboBox 
    id="comboBox1" 
    value="#{viewScope.Combo1}"> 
    <xp:selectItem 
     itemLabel="Value1.1" 
     itemValue="1.1"> 
    </xp:selectItem> 
    <xp:selectItem 
     itemLabel="Value1.2" 
     itemValue="1.2"> 
    </xp:selectItem> 
    <xp:selectItem 
     itemLabel="Value1.3" 
     itemValue="1.3"> 
    </xp:selectItem> 
    <xp:eventHandler 
     event="onchange" 
     submit="false"> 
     <xp:this.script> 
      <xp:scriptGroup> 
       <xp:executeClientScript script="console.log('combo1 changed');"></xp:executeClientScript> 
       <xp:executeClientScript script="fireEvent('#{id:targetComboBox}', 'change')"></xp:executeClientScript> 
      </xp:scriptGroup> 
     </xp:this.script> 
    </xp:eventHandler> 
</xp:comboBox> 

<xp:comboBox 
    id="comboBox2" 
    value="#{viewScope.Combo1}"> 
    <xp:selectItem 
     itemLabel="Value2.1" 
     itemValue="2.1"> 
    </xp:selectItem> 
    <xp:selectItem 
     itemLabel="Value2.2" 
     itemValue="2.2"> 
    </xp:selectItem> 
    <xp:selectItem 
     itemLabel="Value2.3" 
     itemValue="2.3"> 
    </xp:selectItem> 
    <xp:eventHandler 
     event="onchange" 
     submit="true" 
     refreshMode="norefresh" 
     onComplete="fireEvent('#{id:targetComboBox}', 'change')"> 
     <xp:this.action><![CDATA[#{javascript:print("combo2 changed")}]]></xp:this.action> 
     <xp:this.script> 
      <xp:scriptGroup> 
       <xp:executeClientScript script="console.log('combo2 changed');"></xp:executeClientScript> 
      </xp:scriptGroup> 
     </xp:this.script></xp:eventHandler> 
</xp:comboBox> 

在這個例子中，COMBO1都有自己CSJS事件和combo2有一個SSJS和一個CSJS事件。兩者都觸發目標ComboBox ...

Answer 2

看起來像這個問題的副本。你也可以在服務器端做，在那裏看到我的答案。現在再次測試，getComponent需要獲取EventHandler組件，而不是Button組件，因此您需要向要調用的eventHandler添加一個ID，並調用getComponent。