Simple CRUD with modalpanel
elbobo19 Jun 24, 2009 11:33 AMHi,
I'd like to develop a simple CRUD application with modalpanel. I try to implement the new entity insertion function. A have a New button on my page, when I click on it, the modalpanel is activated and I can insert the datas. On the modalpanel there is two buttons Save and Close. My proble is: If a enter some data, click on the Close button (without saving), and after click again the New button the form contains the old datas (what I entered before).
Here is my code:
The "entity":
public class Person { @NotNull(message="Can not be null") private Integer id; @Length(min=3, max=10, message="Length should be between 3 and 10") private String name; public Person(Integer id, String name) { this.name = name; this.id = id; } public Person() { } public void setId(Integer id) { this.id = id; } public Integer getId() { return id; } public void setName(String name) { this.name = name; } public String getName() { return name; } }
The bean behind the page:
@Name("personHandler") @Scope(ScopeType.SESSION) public class PersonHandler { private List<Person> persons; private Person tempPerson; @Create public void initialize() { persons = new ArrayList<Person>(); persons.add(0, new Person(1, "Bud Spencer")); persons.add(1, new Person(2, "Terence Hill")); } public void doNew() { this.tempPerson = new Person(); } public void doSave() { persons.add(tempPerson); } public List<Person> getPersons() { return this.persons; } public void setTempPerson(Person tempPerson) { this.tempPerson = tempPerson; } public Person getTempPerson() { return tempPerson; } }
And the page:
<a4j:form> <rich:panel> <a4j:commandButton action="#{personHandler.doNew}" oncomplete="#{rich:component('editPanel')}.show()" value="New Person" /><br /><br /> <rich:dataTable id="personsTable" value="#{personHandler.persons}" var="person" rowKeyVar="row"> <rich:column> <f:facet name="header">ID</f:facet> <h:outputText value="#{person.id}" /> </rich:column> <rich:column> <f:facet name="header">Name</f:facet> <h:outputText value="#{person.name}" /> </rich:column> </rich:dataTable> </rich:panel> </a4j:form> <rich:modalPanel id="editPanel" autosized="true" width="450"> <f:facet name="header">Edit</f:facet> <f:facet name="controls"> <h:panelGroup> <h:form><a4j:commandButton value="Close" onclick="#{rich:component('editPanel')}.hide()" /></h:form> </h:panelGroup> </f:facet> <a4j:form ajaxSubmit="true" id="personForm"> <h:panelGrid columns="3"> <h:outputText value="ID: " /> <h:inputText id="userid" value="#{personHandler.tempPerson.id}"> <rich:ajaxValidator event="onblur" /> </h:inputText> <rich:message id="useridError" for="userid" style="color: red;" /> <h:outputText value="Name: "> <h:inputText id="username" value="#{personHandler.tempPerson.name}"> <rich:ajaxValidator event="onblur" /> </h:inputText> <rich:message id="usernameError" for="username" style="color: red;" /> <a4j:commandButton value="Save" action="#{personHandler.doSave}" oncomplete="if (#{facesContext.maximumSeverity==null}) #{rich:component('editPanel')}.hide();" reRender="personsTable" /> </h:panelGrid> </a4j:form> </rich:modalPanel>
I have seen the live demo application, but I can't resolve the problem. Can anybody help me?