We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
close icon

Hide timezone when all day is checked

Hi

I want to hide All Day checkbox when Timezone checkbox is checked, please reply Asap.


1 Reply

SR Swathi Ravi Syncfusion Team November 11, 2022 02:01 PM UTC

You can achieve your requirement with the help of binding the click handler to the timezone wrapper element and changing the all-day check box visibility based on the timezone checkbox value while the timezone check box is clicked, as shared in the below snippet.


Sample: https://stackblitz.com/edit/angular-1gcb12?file=app.component.ts


[app.component.ts]

@Component({

  // tslint:disable-next-line:component-selector

  selector: 'app-root',

  templateUrl: 'app.component.html',

  styles: [

    `.e-allday-disable {

        display: none;

    }`,

  ],

   encapsulation: ViewEncapsulation.None,

})

 

 public onPopupOpen(argsPopupOpenEventArgs): void {

    const allday = document.querySelector('.e-all-day-container');

    const timezone = document.querySelector('.e-time-zone-container');

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

      timezone.addEventListener('click'function (event) {

        const checked = ((event.currentTarget as HTMLElement).querySelector('.e-checkbox'as any).ej_instances[0].checked;

        if (checked) {

          allday.classList.add('e-allday-disable');

        } else {

          allday.classList.remove('e-allday-disable');

        }

      });

    }

  }


Loader.
Live Chat Icon For mobile
Up arrow icon