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

爷,独闯天下 提交于 2019-12-20 09:47:09

问题


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


回答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>



回答2:


Yes:

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



回答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>



回答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>


来源:https://stackoverflow.com/questions/3547581/how-to-re-render-uirepeat-using-fajax-render

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!