f:ajax doesn't work when parameters are passed using f:param

Question

I am calling a method on the click of link. The following code works ajaxfully

                        <ui:repeat value="#{myBean.names}" var="name"
                               varStatus="idx">
                        <li>
                            <h:commandLink value="#{name.label}">
                                <f:ajax execute="@this" event="click" render="@all" listener="#{myBean.changeActiveName}" >
                                </f:ajax>
                            </h:commandLink>
                        </li>
                    </ui:repeat>

But when I try to pass parameter to the Ajax call it starts refreshing the whole page

                    <ui:repeat value="#{myBean.names}" var="name"
                               varStatus="idx">
                        <li>
                            <h:commandLink value="#{name.label}">
                                <f:ajax execute="@this" event="click" render="@all" listener="#{myBean.changeActiveName}" >
                                    <f:param name="idx" value="#{idx}" />
                                </f:ajax>
                            </h:commandLink>
                        </li>
                    </ui:repeat>

What is wrong with this code?

Answer 1

The <f:param> has to be a child of the parent UICommand component, not of <f:ajax>.

<h:commandLink value="#{name.label}">
    <f:param name="idx" value="#{idx}" />
    <f:ajax listener="#{myBean.changeActiveName}" render="@all" />
</h:commandLink>

(note that I removed the execute and event attributes as your definitions are the defaults already; plus I wonder how it's useful to send a whole IterationStatus instance as request parameter ... maybe you just wanted to send the index instead? Use #{idx.index} instead or so)

See also:

• How can I pass selected row to commandLink inside dataTable? (although this treats <h:dataTable>, exactly the same answer applies to <ui:repeat> as well)