通过自定义控件属性或自定义控件的自定义事件传递函数？

Question

这是我想要做的。我有一个按钮的自定义控件。如果我把它放在一个页面上，我希望最终用户程序员定义按钮被按下时会发生什么。

我对如何做到这一点，但不知道他们是否有可能的，当然不会不知道怎么做了三个想法。

1. 通过自定义属性传递函数。该按钮将作为一个函数调用该自定义属性。这可能吗？如果是的话，我会怎么做呢？我尝试过，但似乎没有工作。

   compositeData.ssjs_clickOK（“Hello World”）;

2. 定义自定义控制自定义事件。这可能吗？它将如何完成。

3. 有按钮调用需要由用户程序员定义一个唯一的函数名。看起来有点凌乱，但它可能工作。我的按钮代码如何查看函数是否已被定义？如果（MySpecialFunction！= null）会起作用吗？

Answer 1

我使用我的应用程序之一，下面的函数传递到自定义控制：

1）在自定义控制，添加将保持功能的属性，以在我们的操作按钮被执行。我会打电话给我的'querySave'。属性类型必须是'javax.faces.el.MethodBinding'。编辑器必须是“方法绑定编辑器”。

2）。下面是这个例子的自定义控件的操作按钮后面的代码：

if (compositeData.querySave) if (!compositeData.querySave.call()) return; 
currentDocument.save(); 

这是说：如果在属性“QuerySave的”定义的函数，调用它。如果函数返回false，则不要保存文档。

3）定义一个SSJS函数，它执行你需要的动作按钮。我通常把我的地方放在一个SSJS图书馆里。确保XPage可以访问该功能。

4）在包含该控件XPage上，使用我们在步骤1中创建的属性编辑器（QuerySave的在这个例子中），并输入您在步骤3中重要创建函数的名称：不要在输入函数名称时不添加括号或参数 - 如果这样做，函数将在加载时执行，而不是在单击操作按钮时执行。另外，不要将任何代码直接添加到编辑器，只是函数名称。此编辑器中的任何代码也将在加载时执行。

感谢Bill Hanson for the answer on Experts Exchange。

-

更新：

这里有一个自定义属性这样一个自定义控制，其中有问题的SSJS函数被调用validateDocument的一个具体的例子：

<xc:component_buttons> 
    <xc:this.validateFunctionName><![CDATA[#{javascript:validateDocument}]]></xc:this.validateFunctionName> 
</xc:component_buttons> 

这里是自定义控件中调用该函数的按钮示例：

<xp:button id="submit" value="Save"> 
    <xp:eventHandler event="onclick" submit="true" refreshMode="complete"> 
     <xp:this.action> 
      <xp:actionGroup> 
       <xp:this.condition><![CDATA[#{javascript: 
       if (compositeData.validateFunctionName) { 
        compositeData.validateFunctionName.call(); 
       }}]]> 
       </xp:this.condition> 
       <xp:save></xp:save> 
      </xp:actionGroup> 
     </xp:this.action> 
    </xp:eventHandler> 
</xp:button> 

Answer 2

看一看这个问题：Pass javascript code to Custom Control

我的答案介绍了如何从一个自定义的控制通过一个方法绑定传递SSJS代码。

编辑：

1. 创建自定义控制“ccSSJS”
2. 添加属性ssjsCode你的CC
   • 类型：javax.faces.el.MethodBinding
   • 编辑：方法绑定E ditor

3. 这是CC的源

   <?xml version="1.0" encoding="UTF-8"?> 
   <xp:view xmlns:xp="http://www.ibm.com/xsp/core"> 
   
       <xp:button value="Label" id="button1"> 
       <xp:eventHandler event="onclick" submit="true" 
        refreshMode="complete"> 
        <xp:this.action> 
         <![CDATA[#{javascript: 
          var args = new Array(); 
          args["abc"] = "123"; 
          args["cde"] = "456"; 
          compositeData.ssjsCode.invoke(facesContext, null); 
         }]]> 
        </xp:this.action> 
       </xp:eventHandler> 
       </xp:button> 
   </xp:view> 
   

4. 创建的XPage并添加自定义控制

   <?xml version="1.0" encoding="UTF-8"?> 
   <xp:view xmlns:xp="http://www.ibm.com/xsp/core" xmlns:xc="http://www.ibm.com/xsp/custom"> 
   
   <xc:ccSSJS> 
        <xc:this.ssjsCode> 
        <![CDATA[#{javascript: 
         var app = facesContext.getApplication(); 
         app.createMethodBinding("#{javascript:print(args['abc'])}", null); 
        }]]> 
        </xc:this.ssjsCode> 
       </xc:ccSSJS> 
   
   </xp:view> 
   

如果您单击自定义控制按钮，方法ssjsCode将被调用。

Answer 3

包含自定义控制页面上的任何地方定义任意事件处理程序，并确保给它一个id：

<xp:eventHandler id="customEvent" event="customEvent"> 
<xp:this.action> 
<![CDATA[#{javascript://your custom code}]]> 
</xp:this.action> 
</xp:eventHandler> 

然后，您可以通过该方法与事件处理程序相关联的绑定成一个自定义属性一个接受的的MethodBinding自定义控件（或“对象”）：

getComponent("customEvent").getAction(); 

然后，从您的自定义控制里面，你可以调用方法是直接绑定：

var customMethod = compositeData.get("customEvent"); 
var customArguments = compositeData.get("customEventArguments"); 
customMethod.invoke(facesContext, customArguments); 

请确保您的自定义控件的“customEventArguments”属性设置为允许多个...这会强制将该属性视为invoke方法期望的数组。

Answer 4

这是第四个选项。不要在自定义控件上包含按钮。相反，请添加一个可编辑区域，使用id="actionButton"。你可以告诉开发者，他们需要通过在自定义控件的设计定义方法是使用下面添加一个按钮，其中：

<?xml version="1.0" encoding="UTF-8"?> 
<xp:view xmlns:xp="http://www.ibm.com/xsp/core" style="background-color:#4a4a4a;color:#fff;"> 
Add a button to the facet below.<br/> 
<xp:callback facetName="actionButton" id="callback1"></xp:callback> 
</xp:view> 

列入XP的：回调的设计定义将给出一个拖放区域运行时为开发人员添加按钮。 （按钮可能需要位于面板或其他容器控件中，我不确定）。如果客户控件上已经有其他可编辑区域，则您还需要在设计定义中包含这些区域。