I need implement function working on dblclick, like dayClick callback. I tried all solutions, which I found, but nothing work for me, eg Michel's answer. By the way, all threads are quite old.
The problem seems so trivial, but I ran out of ideas why it doesn't work.
Does anyone know how this should be done in the latest version?
UPDATE
ok, I found the problem :)
it stops working when I set this option: selectable: true
I add this instead:
dayRender: (date, element, view) ->
element.bind "dblclick", ->
alert "double click!"
dayClick: (date, jsEvent, view) ->
$(".fc-highlight").removeClass("fc-highlight")
$(jsEvent.toElement).addClass("fc-highlight")
And works perfectly :)
Thanks for Your help.
UPDATE 2
However, the above solution is not perfect. Some elements cover day object and it doesn't work on entire surface of day, so I came up with another solution:
findClickedDay = (e) ->
days = $("#calendar .fc-day")
i = 0
while i < days.length
day = $(days[i])
mouseX = e.pageX
mouseY = e.pageY
offset = day.offset()
width = day.width()
height = day.height()
if mouseX > offset.left and mouseX < offset.left + width and mouseY > offset.top and mouseY < offset.top + height
return day
i++
eventAfterAllRender: (view) =>
$("#calendar").bind "dblclick", (e) =>
clickedDay = findClickedDay(e);
if clickedDay.length == 0 then return
date = new Date(clickedDay.data('date'))
alert "dblclick on date: #{date}"
fullcalendar V1.x
It works fine with eventRender
Click for jsfiddle link.
The eventRender
Triggered while an event is being rendered. && dayRender
is A hook for modifying a day cell. Click for dayRender docs
eventRender: function(event, element) {
element.bind('dblclick', function() {
alert('double click!');
});
},
I Think this is a common problem that usually requires some hacking. @Valar Morghulas's event render solution is nice to catch the event doubleclicks. For the rest of the calendar though, maybe this is a bit cleaner.
(You basically remember the date on a single click using the dateClick callback and forget it once the mouse moves)
jsfiddle demo
$('#calendar').fullCalendar({
...
dayClick: dayClickCallback,
eventRender: eventRenderCallback,
...
});
var slotDate;
function dayClickCallback(date){
slotDate = date;
$("#calendar").on("mousemove", forgetSlot);
}
function eventRenderCallback(event,element){
element.on("dblclick",function(){
dblClickFunction(event.start)
});
}
function forgetSlot(){
slotDate = null;
$("#calendar").off("mousemove", forgetSlot);
}
function dblClickFunction(date){
alert(date);
}
$("#calendar").dblclick(function() {
if(slotDate){
dblClickFunction(slotDate);
}
});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With