Disable recurrence editor options

[Carla Candiotti]

Hello,

Is this possible to prevent user from selecting infinite recurrences?

Our need is to force users to choose either a date or a count to end recurrences. Is the component configurable for this use case?

Thanks for your response

[Swathi Ravi]

Hi Carla,

You can remove the Never option from the End type in recurrence editor options, like the below-shared snippet.

Sample: https://stackblitz.com/edit/angular-v14obe-lrphsa?file=src%2Fapp.component.ts

[app.component.ts]

public onPopupOpen(args: PopupOpenEventArgs): void {

    if (args.type === 'Editor') {

      if (this.scheduleObj.eventWindow.recurrenceEditor) {

        ((args.element)as any).ej2_instances[0].open = () => {

          if (this.scheduleObj.eventWindow.recurrenceEditor.endType.dataSource.length > 2) {

            // Setting up the defaule end type as Until

            this.scheduleObj.eventWindow.recurrenceEditor.endType.setProperties({ value: 'until' });

            this.scheduleObj.eventWindow.recurrenceEditor.endType.open = (args) => {

              // Hiding the never end type

              args.popup.element.querySelector('[data-value="never"]').style.display = 'none';

            }

          }

        }

      }

    }

  }

 

Regards,

Swathi Ravi

[Carla Candiotti]

Hello,

Thanks for your response. I'll test your solution, but isn't there a simpler method to do so? We should't have to tinker to configure components, why aren't they configurable on their own?

Regards

[Swathi Ravi]

Carla,

We don’t have an inbuild option to customize the end type option data source, You can hide the never option from the end type like the below-shared snippet.

Sample: https://stackblitz.com/edit/ej2-angular-scheduler-recurrence-options-hide?file=src%2Fapp.component.ts

[app.component.ts]

public onPopupOpen(args: PopupOpenEventArgs): void {

    var recurrence = this.scheduleObj.eventWindow.recurrenceEditor;

    var option = recurrence.endType.dataSource;

      if(option[0].value == 'never'){

        this.scheduleObj.eventWindow.recurrenceEditor.endType.dataSource = option.slice(1);    // to remove the never option

      }

      if(!args.data.RecurrenceRule){

        document.querySelector(".e-end-on-date").classList.remove('e-hide-recurrence-element');

      }

  }