How to render a panelGroup with a h:commandLink and f:ajax - jsf

Question

I want to render a <h:panelGroup> when the user clicks on a <h:commandLink>.
I can make it work without ajax, but the whole page is refreshed. When I try to use <f:ajax>, then the action is not invoked.
How is this caused and how can I solve it?
Here is the code of my link:
<a4j:outputPanel>
<h:commandLink action="#{ObjetEleve.showInfosPersos}" style="text-decoration:none;">
<a4j:ajax event="click" render=":corps:panelInfos"/>
<a4j:outputPanel layout="block" styleClass="menu_item_static_header">
<h:panelGroup layout="block" styleClass="menu_item_static">
<h:outputText value="#{(ObjetEleve.displayModifications) ? 'Retour au mur' : 'Modifier mes informations'}" />
</h:panelGroup>
</a4j:outputPanel>
</h:commandLink>
</a4j:outputPanel>
And here is the code of the panel that I want to be rendered:
<h:panelGroup id="panelInfos">
<h:panelGroup id="infoPerso"
rendered="#{(ObjetEleve.displayModifications) ? true : false}"
layout="block">
<a4j:outputPanel id="infosPersos" layout="block">
<h:panelGrid width="580" columns="2" border="0">
<h:panelGrid id="panelInscription" columns="2" border="0"
cellspacing="0" cellpadding="0">
<a4j:outputPanel>
<h:outputText value="Nom" />
<h:outputText value="*" style="color:#ff0000;" />
</a4j:outputPanel>
<a4j:outputPanel>
<h:inputText id="nomInscription"
value="#{ObjetEleve.nom_eleve}" styleClass="inputbox"
required="true" requiredMessage="Nom obligatoire" />
</a4j:outputPanel>
<h:outputText value="" />
<h:outputText value="" />
<a4j:outputPanel>
<h:outputText value="Prénom" />
<h:outputText value="*" style="color:#ff0000;" />
</a4j:outputPanel>
<a4j:outputPanel>
<h:inputText id="pnomInscription"
value="#{ObjetEleve.prenom_eleve}" styleClass="inputbox"
required="true" requiredMessage="Prénom obligatoire" />
</a4j:outputPanel>
<h:outputText value="" />
<h:outputText value="" />
<a4j:outputPanel id="pwd">
<h:outputText value="Mot de passe" />
<h:outputText value="*" style="color:#ff0000" />
</a4j:outputPanel>
<a4j:outputPanel>
<h:inputSecret id="passwd" value="#{ObjetEleve.pwd_eleve}"
redisplay="true" styleClass="inputbox" required="true"
requiredMessage="Mot de passe obligatoire" />
</a4j:outputPanel>
<h:outputText value="" />
<h:outputText value="" />
<a4j:outputPanel id="classe">
<h:outputText value="Classe" />
<h:outputText value="*" style="color:#ff0000" />
</a4j:outputPanel>
<a4j:outputPanel>
<rich:select value="#{ObjetEleve.id_classe_eleve}">
<f:selectItems value="#{classeBean.classes}" var="classe"
itemValue="#{classe.id_classe}"
itemLabel="#{classe.nom_classe}" />
</rich:select>
</a4j:outputPanel>
<h:outputText value="" />
<h:outputText value="" />
<a4j:outputPanel>
<h:outputText value="E-Mail" />
<h:outputText value="*" style="color:#ff0000" />
</a4j:outputPanel>
<a4j:outputPanel>
<h:inputText id="email" size="30"
value="#{ObjetEleve.email_eleve}" styleClass="inputbox"
required="true" requiredMessage="Email obligatoire" />
</a4j:outputPanel>
<h:outputText value="" />
<h:outputText value="" />
<a4j:outputPanel>
<h:outputText value="Date de naissance" />
<h:outputText value="*" style="color:#ff0000" />
</a4j:outputPanel>
<a4j:outputPanel>
<rich:calendar value="#{ObjetEleve.date_naissance_eleve}"
required="true"
requiredMessage="Date de naissance obligatoire" />
</a4j:outputPanel>
<h:outputText value="" />
<h:outputText value="" />
<a4j:outputPanel>
<h:outputText value="" />
</a4j:outputPanel>
<a4j:outputPanel>
<h:commandButton value="Mettre à jour les informations"
styleClass="submitButton" />
</a4j:outputPanel>
<h:outputText value="" />
<h:outputText value="" />
</h:panelGrid>
</h:panelGrid>
</a4j:outputPanel>
</h:panelGroup>
</h:panelGroup>

Answer 1

You're overridding the default ajax event for action components, which is event="action" by a event="click". This way JSF won't queue the action event to the action method.
So, use event="action"
<a4j:ajax event="action" render=":corps:panelInfos"/>
or just remove it altogether, it's the default event already
<a4j:ajax render=":corps:panelInfos"/>
The same story applies to <f:ajax>.
See also:
What values can I pass to the event attribute of the f:ajax tag?