search envelope-o feed check
Home Unanswered Active Tags New Question
user comment-o

Context menu on event creates an extra div

Asked by Ruud
2 months ago.

Hello,

I added a context menu to my events, and added some custom CSS. But when i click on the context menu indicator an extra div is added to the dom with the exact same css. It effectively doubles my indicator. Is this normal behaviour?

I added two screenshots showing the extra div.

My event creation looks like this: (typescript)

var event = {
id: reservation.reservationId,
cssClass: 'd-flex',
text: '',
start: reservation.startDate,
end: reservation.endDate,
resource: unitId,
moveVDisabled: true,
moveHDisabled: true,
resizeDisabled: true,
status: reservation.status,
barHidden: true,
areas: [
{
top: 5,
html: txt,
css: 'scheduler-event-text',
},
{
action: 'ContextMenu',
menu: new DayPilot.Menu({
items: [
{
text: "Reservering bewerken", onclick: that.onEditReservation
}
]
}),
top: 5,
visibility: "Visible",
css: "scheduler-event-context-menu fa fa-caret-down",
}
],
};

The Css classes i use look like this: (less)

.scheduler-event-text {
position: relative !important;
flex: 1 1 auto;
white-space: nowrap;
overflow: hidden;
overflow-wrap: normal;
padding: 0 5px;
}

.scheduler-event-context-menu {
position: relative !important;
width: 21px;
height: 18px;
padding: 0 5px;
margin-left: 5px;
float: right;
}

Answer posted by Dan Letecky [DayPilot]
2 months ago.

The purpose of the additional active area div is to keep the icon visible even when you move the mouse out of the event box. It was incorrectly activated for visibility: "Visible" as well. It's now fixed in the latest sandbox build (2018.3.3425).

Comment posted by Ruud
2 months ago.

Great!
Thank you for the fix.

New Reply
This reply is
Your name (optional):