jsf a4j:commandButton reRender doesn't work

Question

My jsf page works fine if I change the first button to h:commandButton. However, that refreshes the entire page on submit so my requirement is to keep both as ajax supported buttons. My backing bean has all the required methods. The following code doesn't print out the selections when the second button is clicked. The log prints 'null' as selection. What am I doing wrong?

<h:form>
<a4j:commandButton action="#{Bean.getAllReps}" value="Get REPS" reRender="showReps" />
</h:form>
<h:panelGrid columns="1" id="showReps">
    <h:panelGrid rendered="#{Bean.actionComplete eq 'fail'}" width="100%" columns="2">
        <h:outputText value="Could not get Details" style="color: red; font-size:3mm;" />
    </h:panelGrid>
            <h:panelGrid rendered="#{Bean.actionComplete eq 'success'}">
                <h:panelGrid>
                    <h:outputText>
                        <rich:panel>
                            <h:form>
                                <h:panelGrid>
                                    <rich:pickList value="#{Bean.slctdRep}" style="text-align: left;">
                                        <f:selectItems value="#{Bean.allReps}" />
                                    </rich:pickList>
                                </h:panelGrid>

                                <a4j:commandButton value="Show Selection" reRender="content" type="submit"></a4j:commandButton> //This button doesn't perform partial refresh on element with id "content"

                            </h:form>
                        </rich:panel>
                        <rich:panel>
                            <h:panelGroup id="content" layout="block">
                                <h:outputText value="Selected Reps : "></h:outputText>
                                <h:outputText value="#{Bean.selectedRepsInString}"></h:outputText>
                            </h:panelGroup>
                        </rich:panel>

                    </h:outputText>
                </h:panelGrid>
            </h:panelGrid>
</h:panelGrid>

yes the first button is called however, if I make second one also a4j:commandButton, then second commandButton stops working. It is not rendering the panel with id='content' — qomzwinx, Aug 23 '19 at 12:44
But it IS reRendering the other rich:panel inside `h:outputText` (which is a weird and to be avoided construct!!! — Kukeltje, Aug 23 '19 at 12:52
What do you suggest I should do to get both buttons working? — qomzwinx, Aug 23 '19 at 12:54
Remove `h:outputText` around things first. It is a weird construct (not that it solves anyting I think) — Kukeltje, Aug 23 '19 at 12:58
And make a [mcve]. There is code missing... I suspect you run into #2 in https://stackoverflow.com/questions/2118656/commandbutton-commandlink-ajax-action-listener-method-not-invoked-or-input-value — Kukeltje, Aug 23 '19 at 12:59
Removed the outputText since it wasn't providing any real benefit. Made a few other changes but my slctdRep method returns null. So, The selected items in pickList on submitting aren't being sent to the bean. But, since the same code works just fine when first button is h:commandButton, I can't seem to locate error, What am I doing wrong? (I'm trying to utilize partial refresh and hence my requirement was to change the first button to a4j ) — qomzwinx, Aug 25 '19 at 18:23
Change your question to reflect you changes. And what about the other link I posted — Kukeltje, Aug 25 '19 at 20:29

qomzwinx · Accepted Answer · 2019-08-26T12:47:14.013

I found the problem, I had two form tags, one for each button and that was causing the issue. I wrapped the entire code in one form and it is working as desired now.

Got the solution from here: commandButton/commandLink/ajax action/listener method not invoked or input value not set/updated

Updated code:

<a4j:form>
    <a4j:commandButton action="#{Bean.getAllReps}" value="Get REPS" reRender="showReps" type="submit" />
    <h:panelGrid columns="1" id="showReps">
        <rich:panel>
            <h:panelGrid>
                <rich:pickList sourceListWidth="200" targetListWidth="200" value="#{Bean.slctdRep}">
                    <f:selectItems value="#{Bean.allReps}" />
                </rich:pickList>
            </h:panelGrid>

            <a4j:commandButton value="Show Selection" reRender="content" type="submit" action="#{Bean.getSelectedReps}" />
        </rich:panel>

        <rich:panel>
            <h:panelGroup layout="block" id="content">
                <h:outputText value="#{Bean.selectedReps}"></h:outputText>
            </h:panelGroup>
        </rich:panel>

    </h:panelGrid>
</a4j:form>

jsf a4j:commandButton reRender doesn't work

1 Answers1