Kombinierte Ansicht Flache Ansicht Baumansicht
Threads [ Zurück | Nächste ]
toggle
Yekel Argoat
Primefaces p:schedule and p:calendar
28. November 2012 04:04
Antwort

Yekel Argoat

Rang: New Member

Nachrichten: 5

Eintrittsdatum: 28. November 2012

Neue Beiträge

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 :

  1@ManagedBean (name="affichageCalendrierManagedBean")
  2@ViewScoped
  3public class AffichageCalendrierManagedBean implements Serializable {
  4
  5    private static final long serialVersionUID = 1L;
  6
  7    IWSSServices wsCtech = new WSServicesAccessor();
  8
  9    private ScheduleModel eventModel;
 10
 11    private ScheduleEvent event = new DefaultScheduleEvent();
 12   
 13    public int idEventPourAffichage;
 14   
 15    private List <Evenement> eventListe;
 16   
 17   
 18    /**
 19     * Constructeur
 20     */
 21    public AffichageCalendrierManagedBean() {
 22        init();
 23    }
 24   
 25    // Getters and Setters
 26    public ScheduleModel getEventModel() {
 27        return eventModel;
 28    }
 29
 30    public void setEventModel(ScheduleModel eventModel) {
 31        this.eventModel = eventModel;
 32    }
 33
 34    public ScheduleEvent getEvent() {
 35        return event;
 36    }
 37
 38    public void setEvent(ScheduleEvent event) {
 39        this.event = event;
 40    }
 41
 42    public int getIdEventPourAffichage() {
 43        return idEventPourAffichage;
 44    }
 45
 46    public void setIdEventPourAffichage(int idEventPourAffichage) {
 47        this.idEventPourAffichage = idEventPourAffichage;
 48    }
 49   
 50   
 51    public List <Evenement> getEventListe() {
 52        return eventListe;
 53    }
 54
 55    public void setEventListe(List <Evenement> eventListe) {
 56        this.eventListe = eventListe;
 57    }
 58
 59    /**
 60     * Méthode qui ajoute des ScheduleEvents à l'objet eventModel (utilisé pour contenir
 61     * les events affichés dans le Schedule) ou les met à jour
 62     * Schedule.
 63     * @param actionEvent
 64     */
 65    public void addEvent(ActionEvent actionEvent) { 
 66        if(event.getId() == null) 
 67            eventModel.addEvent(event); 
 68        else 
 69            eventModel.updateEvent(event); 
 70         
 71        event = new DefaultScheduleEvent(); 
 72    } 
 73      
 74    /**
 75     * Méthode appelée par le listener Ajax à la sélection d'un event dans le Schedule
 76     * On récupère l'objet TEvenement contenu dans l'event sélectionné et on extrait son
 77     * id, qui permettra de le passer en paramètre si l'utilisateur choisit de gérer les souscriptions
 78     * @param selectEvent
 79     */
 80    public void onEventSelect(ScheduleEntrySelectEvent selectEvent) { 
 81        event = selectEvent.getScheduleEvent();
 82        Evenement evenementSelected = (Evenement) event.getData();
 83        idEventPourAffichage = evenementSelected.getIdEvenement();
 84       
 85    } 
 86   
 87    /**
 88     * Méthode d'init de la page
 89     * Initialisation des events du Schedule pour affichage
 90     * Initialisation de la combobox des catégories pour l'update d'un événement
 91     */
 92    private void init()
 93    {
 94        eventModel = new DefaultScheduleModel();
 95        List<Evenement> listOfEvents = new ArrayList<Evenement>();
 96        listOfEvents = wsCtech.getListTEvenements();
 97        eventListe = new ArrayList<Evenement>();
 98        eventListe = listOfEvents;
 99        for (Evenement evt : listOfEvents) {
100            eventModel.addEvent(new DefaultScheduleEvent(evt
101                    .getLibelleEvenement(), evt.getDateDebutEvenement(), evt
102                    .getDateFinEvenement(), evt));
103            System.out.println(evt.getLibelleEvenement());
104        }
105    }
106}

"eventListe" is used for my DataTable.

xhtml page

 1<?xml version='1.0' encoding='UTF-8' ?>
 2<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 3<f:view xmlns="http://www.w3.org/1999/xhtml"
 4    xmlns:h="http://java.sun.com/jsf/html"
 5    xmlns:f="http://java.sun.com/jsf/core"
 6    xmlns:ui="http://java.sun.com/jsf/facelets"
 7    xmlns:p="http://primefaces.org/ui"
 8    xmlns:aui="http://liferay.com/faces/aui">
 9
10   
11<h:head>
12</h:head>
13<h:body>
14
15    <h:form id="formDt">
16    <p:dataTable id="dtLstEvt" var="evt" value="#{affichageCalendrierManagedBean.eventListe}" widgetVar="evtTable" emptyMessage="Pas d'événements"  >
17                        <f:facet name="header">
18                        <p:outputPanel>
19                            <h:outputText value="#{message.labelRechGlobale} "/>
20                            <p:inputText id="globalFilter" onkeyup="evtTable.filter()" />
21                        </p:outputPanel>
22                        </f:facet>
23                        
24                        <p:column id="idEvt" headerText="Id Event" >
25                                <h:outputText value="#{evt.idEvenement}" />
26                        </p:column>
27                        
28                        <p:column id="libelleEvt" filterBy="#{evt.libelleEvenement}" filterMatchMode="contains" headerText="Libellé Evénement" >
29                            <h:outputText value="#{evt.libelleEvenement}" />
30                        </p:column>
31
32                        <p:column id="localisationEvt" filterBy="#{evt.localisationEvenement}" filterMatchMode="contains" headerText="Localisation" >
33                            <h:outputText value="#{evt.localisationEvenement}" />
34                        </p:column>
35                      
36                        <p:column id="catEvt" filterBy="#{evt.categorie}" filterMatchMode="contains"  headerText="Catégorie" >
37                            <h:outputText value="#{evt.categorie}" />
38                        </p:column>
39
40                        <p:column id="datDbtEvt" headerText="Date de début" >
41                            <h:outputText value="#{evt.dateDebutEvenement}" >
42                                <f:convertDateTime pattern="yyyy/MM/dd" timeZone="Europe/Paris" />
43                            </h:outputText>
44                        </p:column>
45                        
46                        <p:column id="datFinEvt" headerText="Date de fin" >
47                            <h:outputText value="#{evt.dateFinEvenement}" >
48                                <f:convertDateTime pattern="yyyy/MM/dd" timeZone="Europe/Paris" />
49                            </h:outputText>
50                        </p:column>
51                    </p:dataTable>
52                   
53                    <!-- essai affichage calendar -->
54                    <p:calendar />
55    </h:form>
56    <h:form id="form">
57
58            <p:growl id="messages" showDetail="true" />
59            
60            <p:schedule value="#{affichageCalendrierManagedBean.eventModel}"
61                widgetVar="mySchedule" aspectRatio="2" id="mySchedule" timeFormat="H:mm" axisFormat="H:mm"
62                locale="fr">                  
63                <p:ajax event="eventSelect" listener="#{affichageCalendrierManagedBean.onEventSelect}" update="eventDetails" oncomplete="eventDialog.show()" /> 
64            </p:schedule>
65            
66            <p:dialog widgetVar="eventDialog" header="Détails de l'événement" showEffect="clip" hideEffect="clip"> 
67                <h:panelGrid id="eventDetails" columns="2"> 
68            
69                    <h:outputLabel for="title" value="Libellé :" /> 
70                    <h:outputText id="title" value="#{affichageCalendrierManagedBean.event.title}" />
71 
72                     <h:outputLabel for="from" value="De :" /> 
73                    <h:outputText id="from" value="#{affichageCalendrierManagedBean.event.startDate}" > 
74                           <f:convertDateTime pattern="dd/MM/yyyy" /> 
75                    </h:outputText> 
76 
77                    <h:outputLabel for="to" value="A :" /> 
78                    <h:outputText id="to" value="#{affichageCalendrierManagedBean.event.endDate}" > 
79                        <f:convertDateTime pattern="dd/MM/yyyy" /> 
80                    </h:outputText>
81            
82                    <h:outputLabel for="lieu" value="Lieu :" /> 
83                    <h:outputText id="lieu" value="#{affichageCalendrierManagedBean.event.data.localisationEvenement}" />   
84                </h:panelGrid> 
85            </p:dialog>
86        </h:form>
87 </h:body>
88</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
Neil Griffin
RE: Primefaces p:schedule and p:calendar
28. November 2012 14:35
Antwort

Neil Griffin

LIFERAY STAFF

Rang: Liferay Legend

Nachrichten: 2054

Eintrittsdatum: 26. Juli 2005

Neue Beiträge

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
RE: Primefaces p:schedule and p:calendar
29. November 2012 02:37
Antwort

Yekel Argoat

Rang: New Member

Nachrichten: 5

Eintrittsdatum: 28. November 2012

Neue Beiträge

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
RE: Primefaces p:schedule and p:calendar
30. November 2012 04:43
Antwort

Yekel Argoat

Rang: New Member

Nachrichten: 5

Eintrittsdatum: 28. November 2012

Neue Beiträge

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
RE: Primefaces p:schedule and p:calendar
30. November 2012 14:16
Antwort

Yekel Argoat

Rang: New Member

Nachrichten: 5

Eintrittsdatum: 28. November 2012

Neue Beiträge

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.
Vernon Singleton
RE: Primefaces p:schedule and p:calendar
20. Dezember 2013 13:56
Antwort

Vernon Singleton

LIFERAY STAFF

Rang: Regular Member

Nachrichten: 168

Eintrittsdatum: 14. Januar 2013

Neue Beiträge

Neil Griffin:
The tutorial you referred to is out-of-date.

Hopefully the tutorial is now up to date.

.