I had define eventDrag as below. However, this is not working.
Could you please guideline me defne it?
In file component, I define event below
eventDrag = {
constrainDragToTimeline: false,
draggable : false,
listeners : {
// Async event listeners allowing you to veto drag operations
beforeDragMoveEnd : async({ eventRecord }) => {
const result = await MessageDialog.confirm({
title : 'Please confirm',
message : `New start time: ${DateHelper.format(eventRecord.startDate, 'ddd LST')}`
});
// Return true to accept the drop or false to reject it
return result === MessageDialog.yesButton;
},
beforeDragResizeEnd : async({ eventRecord }) => {
const result = await MessageDialog.confirm({
title : 'Please confirm',
message : `New duration: ${DateHelper.getDurationInUnit(eventRecord.startDate, eventRecord.endDate, 'h')}h`
});
// Return true to accept the drop or false to reject it
return result === MessageDialog.yesButton;
},
beforeDragCreateEnd : async({ eventRecord }) => {
const result = await MessageDialog.confirm({
title : 'Please confirm',
message : `Want to create an event at ${DateHelper.format(eventRecord.startDate, 'ddd LST')}?`
});
// Return true to accept the drop or false to reject it
return result === MessageDialog.yesButton;
}
}
};
Look at the demo called "confirmation-dialogs" - it shows you how to do it:
const calendar = new Calendar({
appendTo : 'container',
date : new Date(2020, 9, 12),
// CrudManager arranges loading and syncing of data in JSON form from/to a web service
crudManager : {
autoLoad : true,
transport : {
load : {
url : 'data/data.json'
}
}
},
listeners : {
// Async event listeners allowing you to veto drag operations
beforeDragMoveEnd : async({ eventRecord }) => {
const result = await MessageDialog.confirm({
title : 'Please confirm',
message : `New start time: ${DateHelper.format(eventRecord.startDate, 'ddd LST')}`
});
// Return true to accept the drop or false to reject it
return result === MessageDialog.yesButton;
},
beforeDragResizeEnd : async({ eventRecord }) => {
const result = await MessageDialog.confirm({
title : 'Please confirm',
message : `New duration: ${DateHelper.getDurationInUnit(eventRecord.startDate, eventRecord.endDate, 'h')}h`
});
// Return true to accept the drop or false to reject it
return result === MessageDialog.yesButton;
},
beforeDragCreateEnd : async({ eventRecord }) => {
const result = await MessageDialog.confirm({
title : 'Please confirm',
message : `Want to create an event at ${DateHelper.format(eventRecord.startDate, 'ddd LST')}?`
});
// Return true to accept the drop or false to reject it
return result === MessageDialog.yesButton;
}
}
});
I'm download trial filtering and try to apply demo called "confirmation-dialogs",
But it's still not working, may be I'm missing some declare ?
export const calendarConfig = {
listeners : {
// Async event listeners allowing you to veto drag operations
beforeDragMoveEnd : async({ eventRecord }) => {
const result = await MessageDialog.confirm({
title : 'Please confirm',
message : `New start time: ${DateHelper.format(eventRecord.startDate, 'ddd LST')}`
});
// Return true to accept the drop or false to reject it
return result === MessageDialog.yesButton;
},
beforeDragResizeEnd : async({ eventRecord }) => {
const result = await MessageDialog.confirm({
title : 'Please confirm',
message : `New duration: ${DateHelper.getDurationInUnit(eventRecord.startDate, eventRecord.endDate, 'h')}h`
});
// Return true to accept the drop or false to reject it
return result === MessageDialog.yesButton;
},
beforeDragCreateEnd : async({ eventRecord }) => {
const result = await MessageDialog.confirm({
title : 'Please confirm',
message : `Want to create an event at ${DateHelper.format(eventRecord.startDate, 'ddd LST')}?`
});
// Return true to accept the drop or false to reject it
return result === MessageDialog.yesButton;
}
},
Why don't you describe it somewhere in your document or demo,
I spent all day trying to figure out why it didn't work
Your documents are incomplete, very confusing and too difficult to apply
Thank you very much for your input. Based on it, we have improved our Angular Integration guide (not released yet) with new section about listening to Calendar events in Angular.
Is there any place/section in the guide that deserves an improvement?
I have another question.
I have applied example "confirmation-dialogs".
However, when I update event calendar and I click button "No" in popup confirm.
Event calendar not return to the initial position.
So what do I need to make it work
This looks like a new problem. Would you please create a new forum post for it?
Also, attach a runnable showcase to that post please. There is no obvious problem with the code you posted so far, hence we need a code that we can run, investigate and debug.