primefaces selectOneMenu not working in Dialog - jsf

Question

I have this dialog:
The code for this dialog:
<p:dialog header="Détails du produit" showEffect="fade" modal="true"
widgetVar="manageProductDialog" responsive="true">
<p:outputPanel id="manage-product-content" class="ui-fluid">
<p:outputPanel rendered="#{not empty productMB.selectedProduct}">
<p:graphicImage
name="images/product/#{productMB.selectedProduct.img}"
library="demo" styleClass="product-image"
rendered="#{not empty productMB.selectedProduct.img}" />
<div class="p-field">
<p:outputLabel for="name">Nom</p:outputLabel>
<p:inputText id="name" value="#{productMB.selectedProduct.name}"
required="true" />
</div>
<div class="p-field">
<p:outputLabel for="category">Catégorie</p:outputLabel>
<p:selectOneMenu id="category"
value="#{productMB.selectedProduct.category}"
layout="responsive">
<f:selectItem itemLabel="Select One" itemValue="#{null}" noSelectionOption="true" />
<f:selectItems value="#{categoryMB.categories}" var="cat" itemValue="#{cat}" itemLabel="#{cat.name}" />
</p:selectOneMenu>
</div>
<div class="p-formgrid p-grid">
<div class="p-field p-col">
<p:outputLabel for="price">Prix</p:outputLabel>
<p:inputNumber id="price"
value="#{productMB.selectedProduct.price}" symbol=" DH"
symbolPosition="s" decimalSeparator="." thousandSeparator="," />
</div>
</div>
</p:outputPanel>
</p:outputPanel>
<f:facet name="footer">
<p:commandButton value="Enregister" icon="pi pi-check"
actionListener="#{productMB.saveProduct}"
update="manage-product-content"
process="manage-product-content #this" />
<p:commandButton value="Annuler" icon="pi pi-times"
onclick="PF('manageProductDialog').hide()"
class="ui-button-secondary" />
</f:facet>
</p:dialog>
The problem I have is that when I click on Enregister button the p:selectOneMenu is not validated even that a value was selected.
How can I solve this issue ?