When I open a calendar plugin in jquery dialog, I encounter a recurring issue. Every time I close and reopen the dialog, my calendar event onDayClick triggers multiple times – twice, thrice, and so on.
<div id="show_calendar">
<div class="custom-calendar-wrap" ... </div>
</div>
...
<script>
$(function(){
//OpenCalendar
$('.open-calendar').on('click', function() {
var cal = calendar_wall();
$('#show_calendar').dialog('open');
return false;
});
});
...
</script>
Calling calendar_wall() outside the click event prevents repeated triggering. However, since my webpage functions with AJAX, the open calendar button may be clicked multiple times, causing performance issues due to stacking.
:::::UPDATE:::::
I discovered that rebinding the next and previous year buttons resolves the issue. The only remaining problem is that the onDayClick event still triggers repeatedly. See the plugin code below for reference.
$.CalendarWall.defaults = {
monthNames : shortMonthName,
dayNames : DayName,
onDayClick : function( $el, dateProperties ) { return false; }
};
$.CalendarWall.prototype = {
...
...
:::: UPDATE 2 ::::
By adding the following line to the plugin event, the issue of repetitive triggers no longer persists.
this.$el.off('click.calendarWall').on( 'click.click.calendarWall', 'td', function() {