如何将ajax事件附加到复合组件？

Question

我有以下复合组件（<v2：inputText2>）

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:composite="http://java.sun.com/jsf/composite"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:rich="http://richfaces.org/rich">

<!-- INTERFACE -->
<composite:interface>
    <composite:attribute name="baseId" required="true" />
    <composite:attribute name="size" required="true" />
    <composite:attribute name="value" required="true" />
  <composite:attribute name="align" required="false" default="" />
  <composite:attribute name="label" required="false" default="" />
  <composite:attribute name="labelStyle" required="false" default="" />
    <composite:attribute name="disabled" required="false" default="false" />
    <composite:attribute name="required" required="false" default="false" />
    <composite:attribute name="inputStyle" required="false" default="" />
    <composite:editableValueHolder name="inTxt" />
</composite:interface>

<!-- IMPLEMENTATION -->
<composite:implementation>
    <h:panelGroup id="#{cc.attrs.baseId}Dec">
        <table class="decTable" style="align:#{cc.attrs.align};" border="1">
            <tr>
                <td class="labelSize" style="vertical-align: middle;">
                  <h:outputLabel
                        id="#{cc.attrs.baseId}Lbl" for="#{cc.attrs.baseId}"
                        value="#{cc.attrs.label}" style="#{cc.attrs.labelStyle}" /></td>

                <td width="#{cc.attrs.size}">
                  <h:inputText
                        id="inTxt" value="#{cc.attrs.value}"
                        disabled="#{cc.attrs.disabled}"
                        style="width: 99%; #{cc.attrs.inputStyle}"
                        required="#{cc.attrs.required}">
                        <!-- composite:insertChildren / -->
                    </h:inputText></td>
            </tr>

            <tr>
                <td colspan="2"><h:panelGroup id="#{cc.attrs.baseId}Error">
                        <rich:message for="#{cc.attrs.baseid}">
                            <rich:tooltip id="#{cc.attrs.baseId}TT" styleClass="validError">
                                <rich:message id="#{cc.attrs.baseId}TTMsg"
                                    for="#{cc.attrs.baseId}" showDetail="false" showSummary="true" />
                            </rich:tooltip>
                        </rich:message>
                    </h:panelGroup></td>
            </tr>
        </table>
    </h:panelGroup>
</composite:implementation>

</html>

在下面的片段中，我想使用以下方法向此组件添加<a4j：ajax>事件：

    <rich:panel style="width:560px;">
        <f:facet name="header">
            <h:outputText value="Combobox "></h:outputText>
        </f:facet>
        <v2:inputText2 size="300px" baseId="baseId_txt" id="txt" label="Text:"
            value="#{testInput2.value}">
            <a4j:ajax event="change" render="dbgText"/>
        </v2:inputText2>

        <h:outputText value="#{testInput2.value}" id="dbgText"/>
    </rich:panel>
    <aj4:commandButton id="cmdOK" value="Ok"
        action="#{testInput2.cmdOk ()}" render="@form" />

当我调用Testpage时，我得到以下错误：

testInput2.xhtml @23,48 <a4j:ajax> Error: enclosing composite component does not support event change

我该如何解决这个问题？

Ajax-Event应该触发UI-Bean-Methode。

谢谢罗纳德

Answer 1

您需要在复合体的界面中将其注册为客户端行为。

<cc:interface>
    ...
    <cc:clientBehavior name="clientEvent" targets="inputId" event="valueChange" />
</cc:interface>
<cc:implementation>
    ...
    <h:inputText id="inputId" ... />
</cc:implementation>

• name ：您在复合的客户端中指定的自定义事件名称。 可以与实际事件名称相同。 可以是定制的。 这一切都是免费的。
• targets ：应附加实际客户端行为的目标组件的复合实现相对客户端ID。
• event ：实际客户端行为应该侦听的实际事件名称。 请注意， EditableValueHolder组件的默认事件是valueChange而不是change 。 您可以根据需要为文本输入字段继续使用change 。

使用上面的声明示例，您可以在模板客户端中使用它，如下所示：

<my:composite ...>
    <f:ajax event="clientEvent" ... />
</my:composite>

在此之后，您将面临第二个但无关的问题，这个问题已经在这里得到解答和解答： <f：ajax render>无法通过<composite：clientBehavior>工作 。

---

与具体问题无关 ，该复合可以更好地成为标记文件。 并且，HTML表标记不是Web 2.0。