primefaces schedule event color is not working aft

问题:

I use primefaces 4.0 and i try to change the color of the event in Primefaces Lazy Schedule, so i have the following xhtml code

    <style type="text/css"> 
        .Ajout .fc-event-skin {
            background: #00FF00;
        }

        .Livraison .fc-event-skin {
           background:#DF013A;
             </style>

        <p:schedule value="#{scheduleController.lazyEventModel}" locale="fr" showWeekends="true" eventSelectListener="#{scheduleController.onEventSelect}" > 

             <p:ajax event="eventSelect" listener="#{scheduleController.onEventSelect}" update="eventDetails" oncomplete="PF('eventDialog').show()" /> 

         </p:schedule>


<p:dialog widgetVar="eventDialog" header="Event Details" showEffect="clip" hideEffect="clip">  
        <h:panelGrid id="eventDetails" columns="2">  





        </h:panelGrid>  
    </p:dialog>  

And this is the backing bean

public class ScheduleController implements Serializable {  

    private ScheduleModel lazyEventModel;  
  @Inject CalculDAO calculdao;
  @Inject RibhDAO ribhdao;





    public ScheduleController() {  
        lazyEventModel = new LazyScheduleModel() {  

            @Override  
            public void loadEvents(Date start, Date end) {  
                clear();  

                for(Calcul str: calculdao.DisplayCalculs()) 

                  {

                    Calendar cal = Calendar.getInstance();

                    Date random1 = getRandomDate1(str.getDate());
                    Date random2 = getRandomDate2(str.getDate());
                    addEvent(new DefaultScheduleEvent(""+str.getAjouteroulivr(),random1, random2,str.getAjouteroulivr()));  

                  }

for(Ribh str: ribhdao.DisplayRibh()) 

                {             


                Date random1 = getRandomDate1(str.getDate());
                Date random2 = getRandomDate2(str.getDate());
                addEvent(new DefaultScheduleEvent("Bénéfices Net du jour = "+str.getNet()+"dinars",random1, random2));  

                }
            }     
        };  
    }  

    public Date getRandomDate1(Date base) {  
        Calendar date = Calendar.getInstance();  
        date.setTime(base);  


        return date.getTime();  
    }  

    public Date getRandomDate2(Date base) {  
        Calendar date = Calendar.getInstance(); 
         date.setTime(base); 
         date.add(Calendar.MINUTE, 10);      

        return date.getTime();  
    }  

    /////    
    public void onEventSelect(SelectEvent selectEvent) 
    { ScheduleEvent event = (ScheduleEvent) selectEvent.getObject(); 

        //event. = (ScheduleEvent) ((SelectEvent) lazyEventModel).getObject();  

    }      
    ////

    public ScheduleModel getLazyEventModel() 
    {  
        return lazyEventModel;  
    }  
}  

The problem is that this code use to work fine with primefaces 3.3 JARS but when i switched to Primefaces 4.0, colors of events are no more displayed and events became kind of transparent ! what could be the problem with this code ??

PS: str.getAjouteroulivr() is a String that contains the Styleclass of the event it contains "Ajout" or "Livraison"

回答1:

I had the same problem and solved it by using the following css:

.myclass .fc-event,
.myclass a,
.myclass .fc-event-inner{
   background-color: red;
   border-color: red;
   color: white;
}

and then apply the styleClass in code:

event.setStyleClass("myclass");

回答2:

Found out solution for Schedule event Apply this code:

Apply this style in front end

.event1 .fc-event-inner {

    background: Red;
    border-color: Yellow;
}

set this style class in schedule event

event.setStyleClass("event1");

回答3:

Add this in your main.css

.event1{
    background: Red !important;
    border-color: Yellow !important;
}

Add <h:outputStyleSheet name="main.css" link="css"/> in the h:body of your xhtml. Then in your controller class: event.setStyleSheet("event1");

This code in working fine in my project. Try out.......