Event Calendar Popup navigation fires CellClickEvents when selecting a Year


This topic is related to one that was created a few days ago and was fixed in version 5.17.1 of Mobiscroll:


I’m creating a new topic because, although they’re related, they appear with different user interactions.

Steps to reproduce:

1. Define an Event Calendar (Mobiscroll 5.17.1) in a new Angular application (Angular 14.0.0).

In the styles.scss file:

@import "~@mobiscroll/angular/dist/css/mobiscroll";

In the AppModule file:

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';

import { AppComponent } from './app.component';
import { MbscModule, setOptions } from '@mobiscroll/angular';

  theme: 'material',
  themeVariant: 'light',

  declarations: [
  imports: [
  providers: [],
  bootstrap: [AppComponent]
export class AppModule { }

In the AppComponent TS file:

view: MbscEventcalendarView = {
        calendar: {
            type: 'year',

events: MbscCalendarEvent[] = [
        title: 'Event 2022/1/1',
        date: new Date(2022, 0, 1),
        title: 'Event 2022/4/15',
        date: new Date(2022, 3, 15),
        title: 'Event 2022/6/6',
        date: new Date(2022, 5, 6),
         title: 'Event 2022/6/24',
         date: new Date(2022, 5, 24),

handleCellClick(event: MbscCellClickEvent): void {
    console.log('CELL CLICK: ', event);

In the AppComponent HTML file:


   <ng-template #headerTmpl>

         <mbsc-calendar-prev class="ml-auto"></mbsc-calendar-prev>


2. Serve the aplication (ng serve)

Open the pop up navigation (mbsc-calendar-nav) and select the current year (2022).

You should see something like the following:

Also see how the onCellClick Event is getting fired when one selects a year in the popup navigation.

Looks like this is another issue, not related to the previous one.

That’s right, the onCellClick event should fire when a year is selected, and the popup should not be displayed - the popup only appears, when there are events for 1st Jan.

I created a report for this to fix in the next release.

Hi @Josep_Ponsati :wave:

Good news: we have shipped Mobiscroll 5.17.2, where we fixed an issue with the year view, where the onCellClick event was wrongly fired, and displayed the event popover, when selecting a year from the header navigation popup.

Here you can find a guide of how you can update the Mobiscroll version to the latest: Update guide on the latest version of Mobiscroll for plain JS, jQuery, Angular, Ionic and React.