Our pure JavaScript Scheduler component


Post by JohnMousley »

Hi, I'm having a problem with tooltips not showing on any event after an event update has been performed with the task editor.

In my sample project I have created a custom event tooltip that just displays the name of the event, this works fine before the next step.

I have also created a custom tab on the task editor, this tab allows you to input a name and when you click the finish button the name on all the events is updated and the task editor is closed, this works fine.

Now when you put the mouse over the events the tooltips no longer show, and the following errors are generated:

Uncaught (in promise) TypeError: Cannot read property 'then' of undefined
at TaskEdit._callee2$ (schedulerpro.umd.js?version=2:211436)
at tryCatch (schedulerpro.umd.js?version=2:221291)
at Generator.invoke [as _invoke] (schedulerpro.umd.js?version=2:221521)
at Generator.next (schedulerpro.umd.js?version=2:221346)
at asyncGeneratorStep (schedulerpro.umd.js?version=2:220601)
at _next (schedulerpro.umd.js?version=2:220623)
at schedulerpro.umd.js?version=2:220630
at new Promise (<anonymous>)
at TaskEdit.<anonymous> (schedulerpro.umd.js?version=2:220619)
at TaskEdit.save (schedulerpro.umd.js?version=2:211459)

I have created a solution to highlight the issue and attached:
This is using v4.0.8, no other libraries used.
Once loaded you will need scroll to the 15th, events on the top rows.

Attachments
ScheduleWS.zip
(14.38 KiB) Downloaded 81 times

Post by mats »

Could you please try with 4.1.0?


Post by JohnMousley »

The same problem in v4.1.0


Post by pmiklashevich »

Hello,

I've checked your testcase. The problem is not related to the custom tooltip. The way you implemented the editor is not valid. Please do the following instead:

taskEdit : {
    items : {
        customTab : {
            items : {
                myNameField : {
                    label : 'Name',
                    name  : 'name',
                    type  : 'text'
                }
            }
        },
        generalTab      : false,
        notesTab        : false,
        predecessorsTab : false,
        successorsTab   : false,
        advancedTab     : false
    },
    editorConfig : {
        bbar : {
            items : {
                deleteButton : false,
                cancelButton : false
            }
        }
    }
}
listeners : {
    // beforeTaskEditShow is not needed, all fields are configured declarative
    // beforeTaskEditShow({ taskRecord, editor }) {},

beforeEventSave({ source : schedulerPro, eventRecord, editor }) {
    const nameInputValue = editor.widgetMap.myNameField.value;
    schedulerPro.eventStore.beginBatch();
    schedulerPro.eventStore.forEach(record => {
        record.name = nameInputValue;
    });
    schedulerPro.eventStore.endBatch();
}
},

Please see the docs:
https://www.bryntum.com/docs/scheduler-pro/#guides/schedulerpro/taskedit.md
https://www.bryntum.com/docs/scheduler-pro/#SchedulerPro/feature/TaskEdit#event-beforeEventSave
https://www.bryntum.com/docs/scheduler-pro/#SchedulerPro/data/EventStore#function-beginBatch
https://www.bryntum.com/docs/scheduler-pro/#SchedulerPro/data/EventStore#function-endBatch

Cheers!

Pavlo Miklashevych
Sr. Frontend Developer


Post by JohnMousley »

Thanks for the response, what should I do if I want to show/hide different tabs based on the event that is selected?


Post by pmiklashevich »

Then you were right using the beforeTaskEditShow listener.

Pavlo Miklashevych
Sr. Frontend Developer


Post by JohnMousley »

Thanks, I also need to use a custom button to initiate the saving as it has other tasks to perform, is this possible?


Post by pmiklashevich »

Please provide more details of what you're going to do there. Better to interact with the data in the listeners fired when you click save button. There is no public API to trigger save.

Pavlo Miklashevych
Sr. Frontend Developer


Post by JohnMousley »

I have found a way for this to work, I'll initiate the save from the custom button using the following code:

var oObj = document.getElementById(oEditEditor.widgetMap.saveButton.id);
if (oObj) {
	oObj.click();
}

I will then perform all the saving in the beforeEventSave event, this appears to work, and the tooltips still work.


Post by pmiklashevich »

You can get the element from the corresponding property: https://www.bryntum.com/docs/scheduler/#Core/widget/Button#property-element

oEditEditor.widgetMap.saveButton.element

Also you can trigger click handler by firing the click event:
https://www.bryntum.com/docs/scheduler/#Core/widget/Button#function-trigger

oEditEditor.widgetMap.saveButton.trigger('click')

Pavlo Miklashevych
Sr. Frontend Developer


Post Reply