CODEWITHSUNDEEP
javajsfprimefaces
Zaw Than oo
Zaw Than oo

Reputation: 9935

PrimeFaces SelectOneMenu ajax rendering

What was wrong in my program? I think everything is fine. My changeKeyValue method get the selected value 'REFERENCE' and set true boolean value into showReference. But, my page cannot render h:panelGroup if I use update="targetPanel" in p:ajax. It can render h:panelGroup when I use update="entryForm".

What I am missing?

mypage.xhtml

<h:form id="entryForm">
        <p:selectOneMenu value="#{MyBean.keyFactorValue}" required="true" style="width:257px;" id="keyFactorValue">
            <f:selectItems value="#{MyBean.selectItemList}" var="type" itemLabel="#{type.label}" itemValue="#{type}"/>  
            <p:ajax listener="#{MyBean.changeKeyValue}" update="targetPanel" event="change"/>
        </p:selectOneMenu>

        <h:panelGroup id="targetPanel" rendered="#{MyBean.showReference}">
            .......
        </h:panelGroup>

</h:form>

KeyFactorValue.java

public enum KeyFactorValue {
    REFERENCE("Reference"), FORM_TO("From-To"), FIXED("Fixed");

    private String label;

    private KeyFactorValue(String label) {
        this.label = label;
    }

    public String getLabel() {
        return label;
    }
}

MyBean.java

@Scope(ScopeType.CONVERSATION)
@Name("MyBean")
public class MyBean {
    private boolean showReference;

    public boolean isShowReference() {
        return showReference;
    }

    public KeyFactorValue[] getSelectItemList() {
        return KeyFactorValue.values();
    }

    public void changeKeyValue(AjaxBehaviorEvent e) {
        KeyFactorValue type = keyFactor.getKeyFactorValue();
        System.out.println("Selected KeyFactorValue : " + type);
        switch(type) {
            case REFERENCE :{
                showReference = true;
                break;
            }
            default :{
                showReference = false;
                break;
            }
        }
    }

}

Upvotes: 4

Views: 2709

Answers (1)

BalusC
BalusC

Reputation: 1108632

You can't ajax-update an element in HTML which isn't rendered by JSF. JavaScript (the code behind ajax) wouldn't be able to find it by document.getElementById() in order to replace its content.

You can only ajax-update an element in HTML which is always rendered by JSF. Wrap the conditionally rendered component in another component which is always rendered and ajax-update it instead.

<h:panelGroup id="targetPanel">
    <h:panelGroup rendered="#{MyBean.showReference}">
        ...
    </h:panelGroup>
</h:panelGroup>

See also:

Upvotes: 7

Related Questions