4

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

我对如何实现这一点有三个想法,但不知道它们是否可能当然不知道该怎么做。

  1. 通过自定义属性传递函数。该按钮会将该自定义属性作为函数调用。这可能吗?如果是这样,我会怎么做?我试过了,但它似乎没有用。

    复合数据.ssjs_clickOK("Hello World");

  2. 为自定义控件定义自定义事件。这可能吗?会怎么做。

  3. 让按钮调用需要由用户程序员定义的唯一函数名称。看起来有点乱,但它可能会起作用。我的按钮代码如何查看功能是否已定义?if (MySpecialFunction != null) 会起作用吗?

4

4 回答 4

5

我在我的一个应用程序中使用以下内容将函数传递给自定义控件:

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 对专家交流的回答

--

更新:

这是具有自定义属性的此类自定义控件的具体示例,其中所讨论的 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>
于 2012-08-22T13:12:59.830 回答
4

看看这个问题:Pass javascript code to Custom Control

我的回答描述了如何通过方法绑定从自定义控件传递 SSJS 代码。

编辑:

  1. 创建自定义控件“ccSSJS”
  2. 将属性ssjsCode添加到您的 CC
    • 类型:javax.faces.el.MethodBinding
    • 编辑器:方法绑定编辑器
  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 。

于 2012-08-22T12:47:04.177 回答
1

在包含自定义控件的页面上的任意位置定义任意事件处理程序,并确保给它一个 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”属性设置为允许多个...这会强制将该属性视为一个数组,这是调用方法所期望的。

于 2012-08-22T15:47:12.743 回答
0

这是第四个选项。不要在自定义控件上包含按钮。相反,添加一个可编辑区域,使用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:callback 将在运行时为开发人员提供一个放置区域以添加按钮。(该按钮可能需要在面板或其他容器控件中,我不确定)。如果您的客户控件上已经有其他可编辑区域,您还需要在设计定义中包含这些区域。

于 2014-08-19T09:35:49.280 回答