Johnny2012
Johnny2012

Reputation: 1532

JSF Primefaces: how to update selectOneMenu(in form1) from dialogBox in form 2?

I want to update a selectOneMenu in form1 after submitting the commandbutton in form2. It is now only visible after a refresh of the page.

I have a selectOneMenu in form 1:

<h:form id="form1" rendered="#">

            <p:spacer height="30" />
            <h:selectOneMenu id="oneMenu" value="#{bean.value}">
                <f:selectItem itemLabel="Select Value" itemValue="" />
                <f:selectItems id="itemValues"
                    value="#{bean.allItems}" var="allItems"
                    itemValue="#{allItems}" itemLabel="#{allItems.name}" />
            </h:selectOneMenu>

and a DialogBOX in form2:

<h:form id="form2">
            <p:dialog header="Create new Item" widgetVar="newItem"
                resizable="false">

                <h:panelGrid columns="2" style="margin-bottom:10px">

                    <h:outputLabel for="item" value="Itemname:" />
                    <p:inputText id="itemname" value="#{bean.itemName}" />
                </h:panelGrid>

                <p:commandButton value="Submit"
                    actionListener="#{bean.newItem}"
                    update="form1:oneMenu" oncomplete="newItem.hide();"  />

            </p:dialog>

I've tried update="form1:oneMenu" but it doesn't work. I've also read this post but it doesn't work either.

Thanks for help.

Upvotes: 1

Views: 6843

Answers (1)

Zaw Than oo
Zaw Than oo

Reputation: 9935

Make sure to use update=":form1:myPanel".

Example :

<h:form id="form1">
    <h:selectOneMenu id="oneMenu" value="#{bean.value}">
    ...
    </h:selectOneMenu>
</h:form>

<h:form id="form2">
    <p:dialog ..>
        ...
        <p:commandButton value="Submit" update=":form1:oneMenu" ..../>
    </p:dialog>
</h:form>

Otherwise

<h:form id="form1">
    <p:selectOneMenu id="oneMenu" value="#{bean.value}">
    ...
    </p:selectOneMenu>
</h:form>

<h:form id="form2">
    <p:dialog ..>
        ...
        <p:commandButton value="Submit" update=":form1:oneMenu" ..../>
    </p:dialog>
</h:form>

Update For Comment : Try that below. You can use h:selectOneMenu or p:selectOneMenu.

<h:form id="form1">
    <p:selectOneMenu style="width:195px;" required="true" id="cityMenu">
        <f:selectItems value="#{SelectOneMenuBean.cities}"/>
    </p:selectOneMenu>
    <p:commandButton oncomplete="newItem.show()" value="Show Dialog"/>
</h:form>
<h:form id="form2">
    <p:dialog header="Create new Item" widgetVar="newItem" resizable="false">
        <h:panelGrid columns="2" style="margin-bottom:10px">
            <h:outputLabel for="item" value="Itemname:" />
            <p:inputText id="itemname" value="#{SelectOneMenuBean.selectedValue}" />
        </h:panelGrid>

        <p:commandButton value="Submit" update=":form1:cityMenu" oncomplete="newItem.hide();"  />

    </p:dialog>     
</h:form>

public class SelectOneMenuBean {
    private String selectedValue;

    public String getSelectedValue() {
        return selectedValue;
    }

    public void setSelectedValue(String selectedValue) {
        this.selectedValue = selectedValue;
    }

    public String[] getCities() {
        if(selectedValue != null && selectedValue.equals("AAA")) {
            return new String[] {"City_1 of AAA", "City_2 of AAA", "City_3 of AAA"};
        } else if(selectedValue != null && selectedValue.equals("BBB")) {
            return new String[] {"City_1 of BBB", "City_2 of BBB", "City_3 of BBB"};
        } else if(selectedValue != null && selectedValue.equals("CCC")) {
            return new String[] {"City_1 of CCC", "City_2 of CCC", "City_3 of CCC"};
        } else if(selectedValue != null && selectedValue.equals("DDD")) {
            return new String[] {"City_1 of DDD", "City_2 of DDD", "City_3 of DDD"};
        } 
        return new String[] {"No City"};
    }
}

Note : If you input value AAA,BBB,CCC and DDD in dialog, the values of selectedOneMenu will be changed.

Upvotes: 1

Related Questions