Changing Schedule's Event CSS from back bean

Question

I need to change event background color based in some rules, and I already tried the setStyleClass() with no success (I used <h:OutputStylesheet>, <link> and inline CSS in the page already)

My CSS (also tried .fc-event-skin e all variations searching in web)

.atendido .fc-event { 
   background-color: green !important;
   border-color: green !important;
   color: white !important;
}

Part of back bean code:

Paciente p = pDAO.getById(9999998, Paciente.class);
            IdAgenda idAgend = new IdAgenda(dataHoje, p, ambulatorioDoUsuario);
            Agenda a = new Agenda(idAgend, diaDeHoje, 1, null, null, false, null, true, false, false, null, false);
            apagarSemMensagem();
            success = aDAO.save(a);
    if (success == true) {
                    novoAgendamento.setTitle(p.getNome());
                    novoAgendamento.setStyleClass("atendido");
                    eventModel.addEvent(novoAgendamento);
    }

Schedule:

<p:schedule id="agendaOcupacional" allDaySlot="false" slotLabelFormat="HH:mm" widgetVar="myAgendaOcupacional"
                            draggable="false" resizable="false" timeZone="GMT-3" extender="initSchedule" class="bg" slotEventOverlap="false"
                            showWeekends="false" view="agendaDay" slotDuration="00:15:00" value="#{agendamentoBean.eventModel}" locale="br" >
                    <p:ajax event="dateSelect" listener="#{agendamentoBean.onDateSelect}" oncomplete="PF('myAgendaOcupacional').update()"/>
                    <p:ajax event="eventSelect" listener="#{agendamentoBean.onEventSelect}" />
                </p:schedule>

I'm using Primefaces 7.0.

EDIT: In Primefaces 5.0 worked with fc-event-inner.

Sorry, I updated with the schedule code. Yes, I can see the 'atendido' in source, but not in the event itself, just in the source — Roger Alves, Jul 09 '19 at 12:19
Can you try with the CSS rule `.atendido.fc-event` (so no space between the classes)? — Jasper de Vries, Jul 09 '19 at 12:27
You need to create a rule that is more specific than `body .fc .fc-event`. See https://stackoverflow.com/questions/8768317/how-do-i-override-default-primefaces-css-with-custom-styles — Jasper de Vries, Jul 09 '19 at 12:34

score 0 · Answer 1 · answered Jul 09 '19 at 17:27

0

In Primefaces 7.0 you can use .fc-bg

Work with the follow CSS code:

.atendido .fc-bg {
    background-color: red;
    border-color: red;
    color: white;
    opacity: 1;
}

In the back bean, I just called event.setStyleClass("atendido");

answered Jul 09 '19 at 17:27

Roger Alves

46
7

Changing Schedule's Event CSS from back bean

1 Answers1