How to re-render <ui:repeat> using <f:ajax render> - ajax

Question

I have implemented a list created by a repeater:
<ui:repeat value="#{projectData.paginator.list}" var="project">
<h:outputText value="#{project.title}" />
</ui:repeat>
and a Button that filters my list:
<h:commandLink action="#{overviewController.filterNew}">
<h:outputText value="Filter List" />
</h:commandLink>
So, is there an easy way to render only my repeater after clicking the command link (with AJAX) :-)
I tried following:
<f:ajax render="repeater">
ui:repeat id="repeater" value="#{projectData.paginator.list}" var="project">
<h:outputText value="#{project.title}" />
</ui:repeat>
<f:ajax />
<h:commandLink action="#{overviewController.filterNew}">
<h:outputText value="Filter List" />
<f:ajax event="click" render="repeater"/>
</h:commandLink>
but that did not work..
Update
<h:form>
ui:repeat id="repeater" value="#{projectData.paginator.list}" var="project">
<h:outputText value="#{project.title}" />
</ui:repeat>
<h:commandLink action="#{overviewController.filterNew}">
<h:outputText value="Filter List" />
<f:ajax event="click" render="repeater"/>
</h:commandLink>
</h:form>
doesn't work either... Maybe I hav to put the action method (overviewController.filterNew) into the ajax tag?
Update 2
<f:ajax event="click" render="repeater">
<h:commandLink action="#{overviewController.filterEBus}">
<h:outputText value="EBusiness" />
</h:commandLink>
</f:ajax>
Doesn't work either!
Maybe it's not possible to rerender a repeater ? is there another element like a div tag or something that can be rerendered???
...
Thank you for your help

Answer 1

The <ui:repeat> itself does not generate any HTML to the output. The <f:ajax render> expects an ID which is present in the HTML DOM tree. Put it in a <h:panelGroup> with an id and reference it instead.
<h:form>
<h:panelGroup id="projects">
<ui:repeat value="#{projectData.paginator.list}" var="project">
<h:outputText value="#{project.title}" />
</ui:repeat>
</h:panelGroup>
<h:commandLink action="#{overviewController.filterNew}">
<h:outputText value="Filter List" />
<f:ajax execute="#form" render="projects" />
</h:commandLink>
</h:form>

Answer 2

Yes:
using Richfaces <a4j:commandButton reRender="targetId" />
using JSF 2.0 <f:ajax event="click" render="targetId">
using Primefaces <p:ajax>

Answer 3

<f:ajax render="repeater">
ui:repeat id="repeater" value="#{projectData.paginator.list}" var="project">
<h:outputText value="#{project.title}" />
</ui:repeat>
<f:ajax />
why did you wrap it with f:ajax? It's redundant in this case.
Make sure that your components are surrounded by <h:form> tag
<h:form>
<ui:repeat id="repeater" value="#{projectData.paginator.list}" var="project">
<h:outputText value="#{project.title}" />
</ui:repeat>
<h:commandLink action="#{overviewController.filterNew}">
<h:outputText value="Filter List" />
<f:ajax event="click" render="repeater"/>
</h:commandLink>
</h:form>

Answer 4

How about this:
<ui:repeat id="repeater" value="#{projectData.paginator.list}" var="project">
<h:outputText value="#{project.title}" />
</ui:repeat>
<h:commandLink>
<h:outputText value="Filter List" />
<f:ajax render="repeater" listener="#{overviewController.filterNew}" />
</h:commandLink>