JSF 2:Ajax没有在嵌套的复合组件中触发

时间:2012-08-03 15:06:19

标签: jsf-2 composite-component

我的主页包含testcomponent1,其中包含testcomponent2。 Ajax调用在testcomponent2中。该调用在javascript中启动,但从未命中控制器。如果将ajax调用移入testcomponent1,它将触发该调用并将其发送到控制器。我包含测试代码供您参考。

的TestController:

import java.io.Serializable;

import javax.faces.bean.ManagedBean;
import javax.faces.bean.ViewScoped;
import javax.faces.event.AjaxBehaviorEvent;

@ManagedBean
@ViewScoped
public class TestController implements Serializable {
/** <code>serialVersionUID</code> */
private static final long serialVersionUID = -999213365169849345L;

private int customerkey;

private String customerName;

public void processKeyChange(AjaxBehaviorEvent e){
    System.out.println("I am in the Ajax method and my value is: " + customerkey);
}

//GETTERS AND SETTERS
public int getCustomerkey() {
    return customerkey;
}
public void setCustomerkey(int customerkey) {
    this.customerkey = customerkey;
}
public String getCustomerName() {
    return customerName;
}
public void setCustomerName(String customerName) {
    this.customerName = customerName;
}
}

testPage.xhtml     

    <ui:define name="searchCriteria">
        <h:form id="orderHeaderForm" prependId="false">

            <h:panelGroup id="orderDiv" layout="block">
                <com:testcomponent1  id="testComponent1"
                                    customerKey="#{testController.customerkey}"
                                    customerName="#{testController.customerName}"/>

            </h:panelGroup>
        </h:form>
    </ui:define>

</ui:composition>

testcomponent1.xhtml

<cc:interface>
<cc:attribute name="customerKey" type="java.lang.Integer" />
<cc:attribute name="customerName" type="java.lang.String" />
</cc:interface>

<cc:implementation>
<h:panelGroup id="#{cc.clientId}" layout="block">
    <com:testcomponent2 id="testcomponent2" 
                key="#{cc.attrs.customerKey}"
                name="#{cc.attrs.customerName}" />

</h:panelGroup>
</cc:implementation>

testcomponent2.xhtml                    

<cc:implementation>
<h:panelGrid id="#{cc.clientId}" columns="2" border="0" cellspacing="0"     cellpadding="0">
    <h:outputLabel id="customerid" for="txtcustomerKey"/>
    <h:inputText id="txtcustomerKey" value="#{cc.attrs.key}" onchange="alert (document.getElementById(this.id).value)">
        <f:ajax event="change" listener="#{testController.processKeyChange}" execute="@this" render="txtCustomerName" />
    </h:inputText>
    <h:outputLabel id="customerName" for="txtCustomerName"/>
    <h:outputText value="#{cc.attrs.name}" id="txtCustomerName" />
</h:panelGrid>

</cc:implementation>

感谢

2 个答案:

答案 0 :(得分:1)

我认为问题出在<h:panelGrid id="#{cc.clientId}"...>。默认情况下,复合组件是UINamingContainer的实例,因此,您可以使用任何名称设置ID并使用它。一个好的做法是避免在id字段中使用EL表达式。

答案 1 :(得分:0)

您不应将#{cc.clientId}重新指定为JSF组件的ID,而应将其重新指定为普通香草HTML元素的ID,例如<span><div>

<span id="#{cc.clientId}">

<div id="#{cc.clientId}">