How to use popupPanel in RichFaces 4.
I am richfaces 3.3 user, and I want to migrate my application to richfaces 4, and encoutered many problems....such as the the popupPanel in richfaces4, it is very strange, I have tried all the method I used in richfaces 3.3, still did not work.
I wasted two days on teh popupPanel...
I used Seam 3, JBoss 7.0.1.Final, Richfaces 4 release...
In the CityEdit page, I added a city with several areacodes, I used a popupPanel to add areaCode..I found I can not get the value of it in the backend bean.
Where is wrong?
<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:a4j="http://richfaces.org/a4j"
xmlns:rich="http://richfaces.org/rich"
xmlns:fn="http://java.sun.com/jsp/jstl/functions"
xmlns:p="http://java.sun.com/jsf/composite/components/property"
template="/WEB-INF/layout/template.xhtml">
<ui:define name="content">
<div class="section">
<h1>#{cityEdit.currentCity.id==null?'Add City':'Edit City'}</h1>
<a4j:outputPanel id="editPane">
<h:form id="editForm">
<fieldset>
<p:input id="cityCountry" label="#{messages['City.Country']}"
required="true">
<h:selectOneMenu value="#{cityEdit.currentCity.country}"
style="width:200px" required="true">
<f:selectItems value="#{countries}" var="c"
itemLabel="#{c.name}" />
<f:validateRequired />
<f:converter converterId="countryConverter" />
</h:selectOneMenu>
</p:input>
<p:input id="cityName" label="#{messages['City.Name']}"
required="true">
<h:inputText id="input" value="#{cityEdit.currentCity.name}"
style="width:200px">
<f:validateRequired />
</h:inputText>
</p:input>
<p:output id="cityAreaCodeOP" label="#{messages['City.AreaCode']}"
verbatim="true">
<a4j:outputPanel id="areaCodeField">
<ui:repeat var="a" value="#{cityEdit.currentCity.areaCodes}"
varStatus="s">
#{a.areaCode}
<a4j:commandLink styleClass="no-decor" render="areaCodeField"
execute="@this" action="#{cityEdit.deleteAreaCode(a)}"
immediate="true"
onclick="if(confirm('#{messages['Confirmation.Delete']}')){return true;}">
<h:graphicImage value="/images/icons/delete.gif"
alt="Delete areacode" />
</a4j:commandLink>
<ui:fragment
rendered="#{not empty cityEdit.currentCity.areaCodes and s.index!=fn:length(cityEdit.currentCity.areaCodes)-1}">
,
</ui:fragment>
</ui:repeat>
#{' '}
<h:graphicImage value="/images/icons/new.gif" alt="new areacode" />
<a4j:commandLink styleClass="no-decor"
render="areaCodeFormInputs" execute="@this"
actionListener="#{cityEdit.initAddAreaCode}"
oncomplete="#{rich:component('newAreaCodePane')}.show();">
<h:outputText value="#{messages['Link.AddAreaCode']}" />
</a4j:commandLink>
</a4j:outputPanel>
</p:output>
<div class="buttonBox">
<h:commandButton id="save" value="#{messages['Buttons.Save']}"
action="#{cityEdit.save}" render="@none" />
#{' or '}
<h:commandLink value="#{messages['Buttons.Cancel']}"
action="#{cityEdit.cancel}" immediate="true" />
</div>
</fieldset>
<rich:popupPanel id="newAreaCodePane" autosized="true"
resizeable="false" model="true" width="480" height="180">
<f:facet name="header">
#{messages['City.Title.AddCityAreaCode']}
</f:facet>
<a4j:outputPanel id="areaCodeFormInputs" layout="block">
<p:input id="cityAreaCode" label="#{messages['City.AreaCode']}"
required="true">
<h:inputText id="input" value="#{cityEdit.areaCode}"
required="true">
</h:inputText>
</p:input>
<div class="buttonBox">
<a4j:commandButton id="saveAreaCode"
value="#{messages['Buttons.Save']}"
action="#{cityEdit.saveAreaCode}"
render="editForm:cityAreaCodeOP:areaCodeField, areaCodeFormInputs"
execute="newAreaCodePane"
oncomplete="if (#{facesContext.maximumSeverity==null}) {#{rich:component('newAreaCodePane')}.hide();}" />
#{' or '}
<a4j:commandLink value="#{messages['Buttons.Cancel']}"
onclick="#{rich:component('newAreaCodePane')}.hide(); return false;" />
</div>
</a4j:outputPanel>
</rich:popupPanel>
</h:form>
</a4j:outputPanel>
</div>
</ui:define>
</ui:composition>
package com.telopsys.siorc.addressee;
import javax.annotation.PostConstruct;
import javax.ejb.Stateful;
import javax.enterprise.context.ConversationScoped;
import javax.enterprise.event.Event;
import javax.enterprise.event.Observes;
import javax.enterprise.event.TransactionPhase;
import javax.inject.Inject;
import javax.inject.Named;
import javax.persistence.EntityManager;
import javax.persistence.PersistenceContext;
import org.jboss.seam.faces.context.conversation.Begin;
import org.jboss.seam.faces.context.conversation.End;
import org.jboss.seam.international.status.Messages;
import org.jboss.seam.logging.Logger;
import org.slf4j.LoggerFactory;
import com.telopsys.siorc.i18n.DefaultBundleKey;
import com.telopsys.siorc.model.City;
import com.telopsys.siorc.model.CityAreaCode;
@Stateful
@ConversationScoped
@Named("cityEdit")
public class CityEditAction {
private static final org.slf4j.Logger logger=LoggerFactory.getLogger(CityEditAction.class);
@PersistenceContext()
EntityManager em;
@Inject
Logger log;
private City currentCity;
private String areaCode;
@Inject
private Event<City> citySavedEventSrc;
@Inject
Messages messages;
public City getCurrentCity() {
return currentCity;
}
public void setCurrentCity(City currentCity) {
this.currentCity = currentCity;
}
public String getAreaCode() {
return areaCode;
}
public void setAreaCode(String areaCode) {
this.areaCode = areaCode;
}
@PostConstruct
public void init() {
if (log.isDebugEnabled()) {
log.debug("call init...");
}
}
@Begin
public void initAdd() {
if (log.isDebugEnabled()) {
log.debug("call initAdd...");
}
this.currentCity = new City();
}
@Begin
public void initEdit(City city) {
if (log.isDebugEnabled()) {
log.debug("call initEdit...@" + city);
}
this.currentCity = em.merge(city);
}
public void saveAreaCode() {
if (log.isDebugEnabled()) {
log.debug("call saveAreaCode...");
log.debug("areacode @"+this.areaCode);
}
logger.debug("areacode @"+this.areaCode);
this.currentCity.addAreaCode(new CityAreaCode(this.areaCode));
}
public void initAddAreaCode() {
if (log.isDebugEnabled()) {
log.debug("call initAddAreaCode...");
}
this.areaCode ="";
}
public void deleteAreaCode(CityAreaCode c) {
if (log.isDebugEnabled()) {
log.debug("call initAddAreaCode...");
}
this.currentCity.removeAreaCode(c);
}
@End
public void save() {
if (log.isDebugEnabled()) {
log.debug("call save...");
}
if (this.currentCity.getId() == null) {
em.persist(this.currentCity);
} else {
this.currentCity = em.merge(this.currentCity);
}
System.out.print("@current city @"+this.currentCity);
this.citySavedEventSrc.fire(this.currentCity);
}
public void onSaved(
@Observes(during = TransactionPhase.AFTER_SUCCESS) City city) {
messages.info(new DefaultBundleKey("city_saved"))
.defaults("City saved").params(city.getName());
}
@End
public void cancel() {
if (log.isDebugEnabled()) {
log.debug("call end...");
}
em.clear();
}
}
