Question

在复合组件中使用ajax时，ajax功能不起作用。代码有什么问题？

复合组件：

<composite:interface>
    <composite:attribute name="filter" required="true" type="java.lang.String" />
    <composite:attribute name="list" required="true" type="java.util.List" />
</composite:interface>
<composite:implementation>
    <h:inputText value="#{cc.attrs.filter}">
        <f:ajax event="keyup" render="#{cc.clientId}:table#{cc.clientId}" />
    </h:inputText>
    <h:dataTable id="table#{cc.clientId}" value="#{cc.attrs.list}" var="elem">
        <h:column>
            <h:outputText value="#{elem}" />
        </h:column>
    </h:dataTable>
</composite:implementation>

现在是豆

@ManagedBean
@SessionScoped
public class Ajaxcc
{
    private String filter;
    private List<String> list;

    public Ajaxcc()
    {
        list = new ArrayList<String>();
        list.add("one");
        list.add("two");
        list.add("three");
        list.add("four");
    }

    public List<String> getList()
    {
        List<String> filteredList = new ArrayList<String>();
        for (String s : list)
        {
            if (filter == null || filter.trim().equals(""))
            {
                filteredList.add(s);
            }
            else if (s.contains(filter))
            {
                filteredList.add(s);
            }
        }
        return filteredList;
    }

    public String getFilter()
    {
        return filter;
    }

    public void setFilter(String filter)
    {
        this.filter = filter;
    }
}

现在的观点：

<h:form>
    <myCustomComponent:ajaxcc list="#{ajaxcc.list}" filter="#{ajaxcc.filter}" />
</h:form>

我正在使用myfaces 2.1.10，由maven在tomcat 7.0.39上进行部署。

预期行为：每当我按下o按钮时，网站上的列表应减少到一，二和四

失败：列表没有减少。

可能是什么解决方案？

顺便说一句，如果我将复合组件的内容放入视图中，它可以正常工作：

<h:form>
  <h:inputText value="#{ajaxcc.filter}">
    <f:ajax event="keyup" render="table" />
  </h:inputText>
  <h:dataTable id="table" value="#{ajaxcc.list}" var="elem">
    <h:column>
      <h:outputText value="#{elem}" />
    </h:column>
  </h:dataTable>
</h:form>

在这种情况下，按o会将列表缩小为预期值。此外，我发现复合组件ajax调用的响应对于数据表字段值似乎是“空的”;直接ajax调用的响应包含新列表。

Answer 1

<h:inputText ...>
    <f:ajax ...render="#{cc.clientId}:table#{cc.clientId}" />
</h:inputText>
<h:dataTable id="table#{cc.clientId}" ...>

这是不必要的笨拙。两个组件都在同一个命名容器中（复合本身！），因此前缀隐式已经由复合本身完成。后缀有效，但不必要。复合组件自己的ID已经在其父命名容器组件的上下文中强制实施唯一性。在浏览器中打开页面，右键单击视图源并观察生成的HTML输出中的ID应该已经对此有了深入的了解。

保持简单：

<h:inputText ...>
    <f:ajax ...render="table" />
</h:inputText>
<h:dataTable id="table" ...>

Ajax-更新同一复合组件中的另一个组件

1 个答案:

另见：