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(args: PopupOpenEventArgs): 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');
}
});
}
}
|