Premium support for our pure JavaScript UI components


Post by sudhanshu.jain »

Hi,

I am using Bryntum SchedulerPro for my react application. From the documentation i see eventTooltip can be customized and can access the event data as shown below:

eventTooltipFeature = {{
          tools: [
            {
              cls: 'b-fa b-fa-cut',
              handler: function () {
                this.hide();
              }
            }
          ],
          header: {
            titleAlign: 'start'
          },
          template: data => `<dl>
             <dt>Time:</dt>
             <dd>
                 ${DateHelper.format(data.eventRecord.startDate, 'LT')} - ${DateHelper.format(data.eventRecord.endDate, 'LT')}
             </dd>
             
<dt>Status:</dt> <dd>${data.eventRecord.status}</dd> <dt>Task type:</dt> <dd>${data.eventRecord.type}</dd> </dl>` }}

Can we customize eventEdit popup in the same way adding a custom template and buttons instead of modifying the items or adding the extra items? Also can we access the event data in the eventEdit popup?


Post by pmiklashevich »

In Scheduler Pro the feature is called TaskEdit. It shows SchedulerTaskEditor. Customization guide is here: https://www.bryntum.com/docs/scheduler-pro/#guides/schedulerpro/taskedit.md

There is no "template" function on the TaskEditor. But the last chapter in the guide shows how to replace the built-in editor with a custom solution on beforeTaskEdit event. There is a demo in simple scheduler, but can be done the same way in Pro: https://www.bryntum.com/examples/scheduler/custom-event-editor/

Pavlo Miklashevych
Sr. Frontend Developer


Post by sudhanshu.jain »

Used popup widget with customised html on eventClick instead of TaskEdit and also on scheduleClick.

const editor = WidgetHelper.openPopup(eventElement, {
      autoClose: true,
      closable: true,
      closeAction: 'destroy',
      header: 'Schedule Task',
      scrollAction: 'realign',
      anchor: true,
      html: '<p>Custom Html</p>',
    }).showByPoint(x, y, { anchor: true });

dynamically changing the x and y values passed in showByPoint based on the position of event/schedule click

  1. Added showByPoint with parameters x and y to show the popup at the point of click, anchor is not visible on adding showByPoint. Is there a way to show the arrow using showByPoint?

  2. On scheduleClick is there a way to highlight the cell that is clicked on with some background color?


Post by mats »

Please start a new thread for every question you have.


Post Reply