jsfprimefacesschedule

How to Reapply Custom Extender Logic to PrimeFaces p:schedule After update() Call?


I'm using the PrimeFaces p:schedule component in my JSF application with a custom JavaScript extender that adds additional content to each event using the eventContent property in FullCalendar. However, I’m facing a two-part issue with keeping this extender logic applied after updates.

Problem Breakdown:

  1. Regenerating JavaScript from Backing Bean: I generate the extender JavaScript dynamically from my backing bean, as shown below:

<h:panelGroup id="scriptPanel">
    <script type="text/javascript">
        #{appointmentsController.generateJsCustomization()}
    </script>
</h:panelGroup>
public String generateJsCustomization() {
    ScheduleConfig config = new ScheduleConfig(
        "", // dayCellContent
        "", // slotLaneContentDay
        "", // slotLaneContentWeek
        scheduleConfig.getBusinessHours() // businessHours
    );
    
    this.jsExtenderCode = JavaScriptGenerator.generateCustomizeSchedule(config, 
        appointments.stream()
            .flatMap(appointment -> appointment.getPatientAppointments().stream())
            .collect(Collectors.toList())
    );
    return this.jsExtenderCode;
}

The JavaScript extender function (jsExtenderCode) is generated correctly, but when I update the schedule, the generated JavaScript isn’t re-rendered on the page. It seems the scriptPanel doesn’t re-render with each update.

  1. Reapplying Extender Logic After Schedule Update: When I call PF('myScheduleWidgetVar').update() to refresh the schedule, it fetches event data efficiently without a full re-render, meaning that my custom extender logic for modifying eventContent does not reapply automatically after each update.

Documentation Insight According to the PrimeFaces documentation:

“Schedule provides a simple client-side API and the update method. Whenever you call update, schedule will query its server-side ScheduleModel instance to check for updates... this approach is much more effective than updating with regular PPR.”

Given that update() doesn’t trigger a full re-render, my extender logic needs to be reapplied after every update.

Question

How can I:

  1. Ensure that the generated JavaScript in generateJsCustomization() is re-rendered on the page after each update?
  2. Reapply the extender logic to the p:schedule component to add custom eventContent after calling update()?

Any suggestions on how to handle both parts of this issue effectively would be greatly appreciated!


Solution

  • After extensive testing, I’ve concluded that there is no need to reapply the extender logic or trigger any AJAX update to customize <p:schedule> after updates or date changes. Instead, the best and smoothest way is to directly access the underlying FullCalendar instance using the PrimeFaces widget and apply desired changes via its API.

    Final Solution:

    let calendar = PF('scheduleWidgetVar').getCalendar();
    if (calendar) {
      // Update visual or behavioral options
      calendar.setOption('dayHeaderFormat', { weekday: 'short' });
    
      // Navigate to a specific date
      calendar.gotoDate('2025-05-10');
    
      // You can also use calendar.changeView('timeGridDay') etc.
    }
    

    Why this works better:

    1. No need to update or rerender the component.
    2. Avoids the issues of extender logic not being re-invoked.
    3. No AJAX calls are required.
    4. Preserves the existing view and calendar state.
    5. Uses FullCalendar’s native API — lightweight and reliable.

    Use the FullCalendar API via PF('schedule').getCalendar() to apply runtime changes. It’s cleaner, faster, and avoids all the extender-related headaches.