Problems with ui:repeat and ajax update

Question

Good night.

I’m having some trouble using the ui:repeat and ajax update of the first faces.

My intention is to list the criteria from the id of the Decision Process to which they are linked so that the user can select, for each of these, whether it is a numerical value (Boolean checkbox) and, depending on the check selection, render if it is a numerical value (spinner) or impact (selectOneMenu).

The problems are:

1°) You are not listing things with ui:repeat. I debugged and found that the list values are being filled in.

2°) I don’t know why, but every time I change the Decision Process, it closes the dialogue (perhaps because I’ve updated every form?)

3°) Why did selectOneMenu space come like this? It shouldn’t be all white until click icon to open list?

View

                <p:panelGrid style="width: 100%;">
                    <p:row> 
                        <p:column><h:outputLabel for="pdMenu" value="Processo de Decisão: " class="componentePF label" /></p:column>
                        <p:column>
                            <p:selectOneMenu id="pdMenu" converter="generic" value="#{topsisBean.pd}" style="width:100% !important;" 
                                class="componentePF text" required="true" requiredMessage="É necessário escolher um processo de decisão">
                                <f:selectItem itemLabel="Escolha um Processo" noSelectionOption="true" />
                                <f:selectItems value="#{topsisBean.pds}" var="pd" itemLabel="#{pd.nomePD}"  
                                    itemValue="#{pd}" converter="generic" />
                                <p:ajax listener="#{topsisBean.mudouPD}" update=":form" />
                            </p:selectOneMenu>
                        </p:column>
                    </p:row>

                    <p:row> 
                        <p:column><h:outputLabel for="projetoMenu" value="Projeto: " class="componentePF label" onclick="#{topsisBean.getProjetosPD()}"/></p:column>
                        <p:column>
                            <p:selectOneMenu id="projetoMenu" converter="generic" value="#{topsisBean.avaliaProjeto.projeto}" 
                                class="componentePF text" required="true" requiredMessage="É necessário escolher um projeto">
                                <f:selectItem itemLabel="Escolha um Projeto" itemDisabled="true" noSelectionOption="true" />
                                <f:selectItems value="#{topsisBean.projetosPD}" var="p" itemLabel="#{p.nomeProjeto}" itemValue="#{p}" converter="generic" />
                            </p:selectOneMenu>
                        </p:column>
                    </p:row>
                </p:panelGrid>

                <p:panelGrid style="width: 100%;" id="avaliaProjetoGrid" rendered="#{topsisBean.pd != null}">
                    <p:row>
                        <p:column><h:outputText value="Critério" class="componentePF label"/></p:column>
                        <p:column><h:outputText value="Valor Numérico" class="componentePF label"/></p:column>                          
                        <p:column><h:outputText value="Valor ou Impacto" class="componentePF label"/></p:column>
                    </p:row>

                    <ui:repeat var="a" value="#{topsisBean.avaliaProjetosPD}">
                        <p:row>
                            <p:column><h:outputText value="#{a.criterio.nomeCriterio}" class="componentePF label"/></p:column>

                            <p:column>
                                <p:selectBooleanCheckbox label="Sim" widgetVar="flag">
                                    <p:ajax update="valor escalaMenu"/>
                                </p:selectBooleanCheckbox>
                            </p:column>

                            <p:column>
                                <p:selectOneMenu id="escalaMenu" converter="generic" value="#{a.escala}" rendered="#{!flag}"
                                    class="componentePF text" required="true" requiredMessage="É necessário escolher uma escala">
                                    <f:selectItem itemLabel="Escolha um Impacto de Escala" itemDisabled="true" noSelectionOption="true" />
                                    <f:selectItems value="#{topsisBean.escalas}" var="e" itemLabel="#{e.impactoEscala}" itemValue="#{e}" converter="generic" />
                                </p:selectOneMenu>

                                <p:spinner id="valor" value="#{a.valor}" class="componentePF text" rendered="#{flag}"/>
                            </p:column>
                        </p:row>
                    </ui:repeat>
                </p:panelGrid>
        </p:dialog>

Bean methods used

public void mudouPD() {
    projetosPD = projetoDAO.listar(pd);
    setaAvaliaProjetosPD();
}

public void setaAvaliaProjetosPD() {
    criterios = criterioDAO.listar(pd);
    avaliaProjetosPD = new ArrayList<>();
    AvaliaProjeto a;

    for(Criterio c : criterios) {
        a = new AvaliaProjeto();
        a.setCriterio(c);

        avaliaProjetosPD.add(a);
    }
}

If you need the pojo, let me know.

Answer 1

I solved the problem by replacing the second panelGrid with a common html table.