jsf - formulario - p:resetinput
Cómo borrar y reutilizar p: diálogo al agregar nuevos elementos (1)
Estoy usando <p:dialog>
para agregar una nueva fila a <p:dataTable>
tomando la entrada del usuario, pero no puedo restablecerlo. Cada vez que muestra datos de entrada anterior y en lugar de agregar está editando la fila actual. ¿Cómo borro los campos?
<h:form id="foodTableForm">
<p:dataTable id="foodTableId" var="v" value="#{dashboardBean.myFoodList}" editable="true">
<p:ajax event="rowEdit" listener="#{dashboardBean.onEdit}" />
<p:ajax event="rowEditCancel" listener="#{dashboardBean.onCancel}" />
<p:column sortBy="#{v.project}" headerText="Project Name">
<p:cellEditor>
<f:facet name="output">
<h:outputText value="#{v.project}" />
</f:facet>
<f:facet name="input">
<p:inputTextvalue="#{v.project}"/>
</f:facet>
</p:cellEditor>
</p:column>
<p:column headerText="#{msg[''product.label.edit'']}">
<p:rowEditor />
</p:column>
<p:column headerText="#{msg[''product.label.delete'']}">
<p:commandLink id="deleteFoodPromotion" actionListener="#{dashboardBean.deleteFoodPromotion(v)}" update="@form" />
</p:column>
</p:dataTable>
</h:form>
<h:form id="dialogInputForm">
<p:dialog widgetVar="dlg">
<p:inputText id="firstname" value="#{dashboardBean.foodPromoDTO.project}" required="true" />
<p:calendar value="#{dashboardBean.foodPromoDTO.promoDate}" id="startDate" required="true" />
<h:selectOneMenu value="#{dashboardBean.foodPromoDTO.action}" required="true">
<f:selectItem itemLabel="Promo Start" itemValue="Promo Start" />
<f:selectItem itemLabel="Promo End" itemValue="Promo End" />
</h:selectOneMenu>
<p:commandLink id="submitButton" value="Save" action="#{dashboardBean.addFoodPromotion}" update="@form" oncomplete="PF(''dlg'').hide();" />
</p:dialog>
</h:form>
No solo necesita recrear el modelo antes de abrir el cuadro de diálogo, sino que también debe actualizar el contenido del diálogo antes de abrirlo.
Aquí hay un ejemplo de inicio:
<h:form id="form">
<p:dataTable id="table" value="#{bean.entities}" var="entity">
<p:column>#{entity.property1}</p:column>
<p:column>#{entity.property2}</p:column>
<p:column>#{entity.property3}</p:column>
...
</p:dataTable>
<p:commandButton value="Add" action="#{bean.add}"
update=":dialog" oncomplete="w_dialog.show()" />
</h:form>
<p:dialog id="dialog" widgetVar="w_dialog">
<h:form>
<p:inputText value="#{bean.entity.property1}" />
<p:inputText value="#{bean.entity.property2}" />
<p:inputText value="#{bean.entity.property3}" />
...
<p:commandButton value="Save" action="#{bean.save}"
update=":form:table" oncomplete="w_dialog.hide()" />
</h:form>
</p:dialog>
(nota: ¡el formulario debe ir dentro del diálogo, no afuera!)
con este frijol:
private List<Entity> entities; // +getter
private Entity entity; // +getter
@PostConstruct
public void init() {
entities = new ArrayList<>();
}
public void add() {
entity = new Entity();
}
public void save() {
entities.add(entity);
}