Fórum

Primefaces p:schedule and p:calendar

Yekel Argoat, modificado 11 Anos atrás.

Primefaces p:schedule and p:calendar

New Member Postagens: 5 Data de Entrada: 28/11/12 Postagens Recentes
Hi all,

I'm trying to develop a Liferay 6.1 portlet showing a Schedule full of events coming from a web service.

My list of events is full of objects (I can see that in the debug window of Liferay), but the Primefaces Schedule is not on my page.
I tried to show a basic Calendar (like the example in http://www.liferay.com/community/wiki/-/wiki/Main/Primefaces+portlet+tutorial , but it doesn't work : I have an inputText...

I 'm using the same List of objects (just before putting them in a ScheduleModel) to make a Database, and it works fine.

Here are my different parts of code :

Managed Bean :

@ManagedBean (name="affichageCalendrierManagedBean")
@ViewScoped
public class AffichageCalendrierManagedBean implements Serializable {

	private static final long serialVersionUID = 1L;

	IWSSServices wsCtech = new WSServicesAccessor();

	private ScheduleModel eventModel;

	private ScheduleEvent event = new DefaultScheduleEvent();
	
	public int idEventPourAffichage;
	
	private List <evenement> eventListe;
	
	
	/**
	 * Constructeur
	 */
	public AffichageCalendrierManagedBean() {
		init();
	}
	
	// Getters and Setters
	public ScheduleModel getEventModel() {
		return eventModel;
	}

	public void setEventModel(ScheduleModel eventModel) {
		this.eventModel = eventModel;
	}

	public ScheduleEvent getEvent() {
		return event;
	}

	public void setEvent(ScheduleEvent event) {
		this.event = event;
	}

	public int getIdEventPourAffichage() {
		return idEventPourAffichage;
	}

	public void setIdEventPourAffichage(int idEventPourAffichage) {
		this.idEventPourAffichage = idEventPourAffichage;
	}
	
	
	public List <evenement> getEventListe() {
		return eventListe;
	}

	public void setEventListe(List <evenement> eventListe) {
		this.eventListe = eventListe;
	}

	/**
	 * Méthode qui ajoute des ScheduleEvents à l'objet eventModel (utilisé pour contenir
	 * les events affichés dans le Schedule) ou les met à jour
	 * Schedule.
	 * @param actionEvent
	 */
	public void addEvent(ActionEvent actionEvent) {  
        if(event.getId() == null)  
            eventModel.addEvent(event);  
        else  
            eventModel.updateEvent(event);  
          
        event = new DefaultScheduleEvent();  
    }  
      
    /**
     * Méthode appelée par le listener Ajax à la sélection d'un event dans le Schedule
     * On récupère l'objet TEvenement contenu dans l'event sélectionné et on extrait son
     * id, qui permettra de le passer en paramètre si l'utilisateur choisit de gérer les souscriptions
     * @param selectEvent
     */
	public void onEventSelect(ScheduleEntrySelectEvent selectEvent) {  
        event = selectEvent.getScheduleEvent();
        Evenement evenementSelected = (Evenement) event.getData();
        idEventPourAffichage = evenementSelected.getIdEvenement();
        
    }  
	
	/**
	 * Méthode d'init de la page 
	 * Initialisation des events du Schedule pour affichage
	 * Initialisation de la combobox des catégories pour l'update d'un événement
	 */
	private void init()
	{
		eventModel = new DefaultScheduleModel();
		List<evenement> listOfEvents = new ArrayList<evenement>();
		listOfEvents = wsCtech.getListTEvenements();
		eventListe = new ArrayList<evenement>();
		eventListe = listOfEvents;
		for (Evenement evt : listOfEvents) {
			eventModel.addEvent(new DefaultScheduleEvent(evt
					.getLibelleEvenement(), evt.getDateDebutEvenement(), evt
					.getDateFinEvenement(), evt));
			System.out.println(evt.getLibelleEvenement());
		}
	}
}</evenement></evenement></evenement></evenement></evenement></evenement>

"eventListe" is used for my DataTable.

xhtml page

<!--?xml version='1.0' encoding='UTF-8' ?-->

<f:view xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:p="http://primefaces.org/ui" xmlns:aui="http://liferay.com/faces/aui">

    
<h:head>
</h:head>
<h:body>

    <h:form id="formDt">
    <p:datatable id="dtLstEvt" var="evt" value="#{affichageCalendrierManagedBean.eventListe}" widgetvar="evtTable" emptymessage="Pas d'événements">
                        <f:facet name="header">
                        <p:outputpanel>
                            <h:outputtext value="#{message.labelRechGlobale} " />
                            <p:inputtext id="globalFilter" onkeyup="evtTable.filter()" /> 
                        </p:outputpanel>
                        </f:facet>
                        
                        <p:column id="idEvt" headertext="Id Event">
                                <h:outputtext value="#{evt.idEvenement}" />
                        </p:column>
                        
                        <p:column id="libelleEvt" filterby="#{evt.libelleEvenement}" filtermatchmode="contains" headertext="Libellé Evénement">
                            <h:outputtext value="#{evt.libelleEvenement}" />
                        </p:column>

                        <p:column id="localisationEvt" filterby="#{evt.localisationEvenement}" filtermatchmode="contains" headertext="Localisation">
                            <h:outputtext value="#{evt.localisationEvenement}" />
                        </p:column>
                       
                        <p:column id="catEvt" filterby="#{evt.categorie}" filtermatchmode="contains" headertext="Catégorie">
                            <h:outputtext value="#{evt.categorie}" />
                        </p:column>

                        <p:column id="datDbtEvt" headertext="Date de début">
                            <h:outputtext value="#{evt.dateDebutEvenement}">
                                <f:convertdatetime pattern="yyyy/MM/dd" timeZone="Europe/Paris" />
                            </h:outputtext>
                        </p:column>
                        
                        <p:column id="datFinEvt" headertext="Date de fin">
                            <h:outputtext value="#{evt.dateFinEvenement}">
                                <f:convertdatetime pattern="yyyy/MM/dd" timeZone="Europe/Paris" />
                            </h:outputtext>
                        </p:column> 
                    </p:datatable>
                    
                    <!-- essai affichage calendar -->
                    <p:calendar />
    </h:form> 
    <h:form id="form">

			<p:growl id="messages" showDetail="true" />
			
			<p:schedule value="#{affichageCalendrierManagedBean.eventModel}" widgetvar="mySchedule" aspectratio="2" id="mySchedule" timeformat="H:mm" axisformat="H:mm" locale="fr">				   
        		<p:ajax event="eventSelect" listener="#{affichageCalendrierManagedBean.onEventSelect}" update="eventDetails" oncomplete="eventDialog.show()" />  
			</p:schedule>
			
			<p:dialog widgetvar="eventDialog" header="Détails de l'événement" showeffect="clip" hideeffect="clip">  
        		<h:panelgrid id="eventDetails" columns="2">  
            
            		<h:outputlabel for="title" value="Libellé :" />  
					<h:outputtext id="title" value="#{affichageCalendrierManagedBean.event.title}" />
  
         			<h:outputlabel for="from" value="De :" />  
        		    <h:outputtext id="from" value="#{affichageCalendrierManagedBean.event.startDate}">  
       		        	<f:convertdatetime pattern="dd/MM/yyyy" />  
            		</h:outputtext>  
  
            		<h:outputlabel for="to" value="A :" />  
            		<h:outputtext id="to" value="#{affichageCalendrierManagedBean.event.endDate}">  
                		<f:convertdatetime pattern="dd/MM/yyyy" />  
            		</h:outputtext>
            
            		<h:outputlabel for="lieu" value="Lieu :" />  
            		<h:outputtext id="lieu" value="#{affichageCalendrierManagedBean.event.data.localisationEvenement}" />   
    			</h:panelgrid>  
    		</p:dialog>
    	</h:form>
 </h:body>
</f:view>


Do I forget something?

Is there a problem with my import jars (in docroot/WEB-INF/lib)?
I put these :
javax.faces-2.1.13
liferay-faces-alloy-3.1.0-ga1
liferay-faces-bridge-3.1.0-ga1
liferay-faces-bridge-impl-3.1.0-ga1
liferay-faces-portal-3.1.0-ga1
liferay-faces-util-3.1.0-ga1
primefaces-3.4.2
thumbnail
Neil Griffin, modificado 11 Anos atrás.

RE: Primefaces p:schedule and p:calendar

Liferay Legend Postagens: 2655 Data de Entrada: 27/07/05 Postagens Recentes
The tutorial you referred to is out-of-date. It uses an old (unsupported) version of PrimeFaces. It also uses PortletFaces Bridge instead of Liferay Faces Bridge.

I would recommend that at step#2, that you choose "JSF 2.0" instead of "Liferay MVC". The wizard should prompt you with "PrimeFaces" on the next screen.
Yekel Argoat, modificado 11 Anos atrás.

RE: Primefaces p:schedule and p:calendar

New Member Postagens: 5 Data de Entrada: 28/11/12 Postagens Recentes
Thanks for your very quick answer, Neil!

I have to upgrade all my Liferay environment to GA2, and I'll try it.

Best regards

Y.
Yekel Argoat, modificado 11 Anos atrás.

RE: Primefaces p:schedule and p:calendar

New Member Postagens: 5 Data de Entrada: 28/11/12 Postagens Recentes
Hi,

Tried with a new environment (Liferay 6.1 GA2 and SDK GA2), but I have the same problem...

Even when I only try to put only a <p:calendar /> in the view.xhtml, with a new created JSF 2.0 Liferay project (the way you told me), I have an input text area.

With a simple <p:schedule />, i have this error on the JAvascript error console : "Uncaught TypeError: Object #<Object> has no method 'fullCalendar' "
Yekel Argoat, modificado 11 Anos atrás.

RE: Primefaces p:schedule and p:calendar

New Member Postagens: 5 Data de Entrada: 28/11/12 Postagens Recentes
How stupid I am... JQuery is already used in the theme we used for our Liferay company theme, that's why Primefaces doesn't work properly...

Should work when I'll be back to the office on Monday.
thumbnail
Vernon Singleton, modificado 10 Anos atrás.

RE: Primefaces p:schedule and p:calendar

Expert Postagens: 315 Data de Entrada: 14/01/13 Postagens Recentes
Neil Griffin:
The tutorial you referred to is out-of-date.

Hopefully the tutorial is now up to date.

.