commandbutton doesnt work when i choose a selectonemenu item in primefaces

Question

when i choose a item in the selectonemenu, my commandbutton's actionlistener doesnt work, and it never works until I load the page, this is my code

 <h:form id="form2" >
            <div class="col-lg-6" >
                <p:panelGrid columns="3">
                    <p:outputLabel value="plato" />
                    <p:selectOneMenu value="#{salonController.productoSeleccionado}" filter="true" filterMatchMode="contains" effect="fade">
                        <f:selectItem itemLabel="seleccione un producto" itemValue="" />
                        <f:selectItems value="#{salonController.listaProductos}" var="item" itemValue="#{item}" itemLabel="#{item.nombre}" />
                    </p:selectOneMenu>
                    <p:commandButton value="añadir" update="dtProductos" actionListener="#{salonController.addProducto()}" />
                </p:panelGrid>
            </div>
            <div class="col-lg-6">
                <p:dataTable id="dtProductos" value="#{salonController.listaProductosEscogidos}" var="dtProd" emptyMessage="aun no se añadieron productos" >
                    <p:column>
                        <p:outputLabel value="#{dtProd.nombre}" />
                    </p:column>
                    <p:column style="width:130px">
                        <p:commandButton class="btn-success"  actionListener="#{salonController.quitarProducto(dtProd)}"
                                         icon="ui-icon-trash" update="dtProductos" value="eliminar" title="Quitar producto"/>
                    </p:column>
                </p:dataTable>

            </div>
        </h:form>

when i debug the controller, after i select an item in the selectonemenu my method addProduto() never runs, before this my method run normaly.

@Named("salonController")
@ViewScoped
public class salonController implements Serializable {

@PostConstruct
public void init() {
    this.productoSeleccionado = new Productos();

}
public Productos getProductoSeleccionado() {
    return productoSeleccionado;
}

public void setProductoSeleccionado(Productos productoSeleccionado) {
    this.productoSeleccionado = productoSeleccionado;
}


public void quitarProducto(Productos producto) {
    this.listaProductosEscogidos.remove(producto);
}

public void addProducto() {
    this.listaProductosEscogidos.add(productoSeleccionado);
}

}

please help me

Answer 1

Your first div in the form have some issue;for e.g p:commandButton value="añadir" should have this actionListener="#{salonController.addProducto} (call the method addProducto without paranthesis) and secondly , according to Primefaces SelectOneMenu your advanced selectOneMenu should look like this:

<h:form id="form2" >
           <div class="col-lg-6" >
              <p:panelGrid columns="3">
                 <p:outputLabel for="advanced" value="plato" />
                 <p:selectOneMenu id="advanced" var="t" value="#{salonController.productoSeleccionado}" filter="true" filterMatchMode="contains" effect="fade">
              <f:selectItems value="#{salonController.listaProductos}" var="item" itemValue="#{item}" itemLabel="#{item.nombre}" />

            <p:column>
            <h:outputText value="#{t.nombre}" />
            </p:column>
           </p:selectOneMenu>
           <p:commandButton value="añadir" update="dtProductos" actionListener="#{salonController.addProducto}" />
           </p:panelGrid>
         </div>
          </h:form>