- Home
- Forum
- Angular - EJ 2
- Getting Error on Scheduler Recurrence Editor "Cannot read property 'getTime' of undefined"
Getting Error on Scheduler Recurrence Editor "Cannot read property 'getTime' of undefined"
Hi,
I am trying to get the data for the recurrence rule but I am getting an error on the save button "Cannot read property 'getTime' of undefined".
Below is the HTML part of the scheduler and Component file.
Html:
<button class="mb-3" ejs-button cssClass='e-info' (click)='editor()'> New Event </button>
<ejs-schedule [currentView]="setViews" [selectedDate]="setDate" startHour='08:00' endHour='20:00'
[eventSettings]="eventObject" #scheduleObj (actionBegin)="onActionBegin($event)"
(popupOpen)="onPopupOpen($event)">
<e-views>
<e-view option='Day'></e-view>
<e-view option='Week' isSelected='true'></e-view>
<e-view option='Month'></e-view>
<!-- <e-view option='MonthAgenda'></e-view>
<e-view option='Agenda'></e-view> -->
</e-views>
<ng-template #editorTemplate let-data>
<table class="custom-event-editor" width="100%" cellpadding="5">
<tbody>
<tr>
<td class="e-textlabel">Lesson</td>
<td colspan="4">
<!-- <ejs-dropdownlist id='ddlelement' [dataSource]='lessonData' [fields]='lessonfields'
placeholder="Select Lesson"></ejs-dropdownlist> -->
<input type="text" id="lessonMaster" name="lessonMaster" class="e-field"
style="width: 100%" />
</td>
</tr>
<tr>
<td class="e-textlabel">Hrs to Schedule</td>
<td colspan="4">
<label for="">45 hrs and 30 min</label>
</td>
</tr>
<tr>
<td class="e-textlabel">Arena</td>
<td>
<!-- <ejs-dropdownlist id='ddlelement' [dataSource]='ArenaData'
placeholder='Select Arena'></ejs-dropdownlist> -->
<input type="text" id="arenaMaster" name="arenaMaster" class="e-field"
style="width: 100%" />
</td>
</tr>
<tr>
<td class="e-textlabel">From</td>
<td colspan="4">
<input id="StartTime" class="e-field" type="text" name="StartTime" />
</td>
</tr>
<tr>
<td class="e-textlabel">To</td>
<td colspan="4">
<input id="EndTime" class="e-field" type="text" name="EndTime" />
</td>
</tr>
<tr>
<td colspan="4">
<div id='RecurrenceEditor'>
<!-- <ejs-recurrenceeditor class="e-field"></ejs-recurrenceeditor> -->
</div>
</td>
</tr>
<tr>
<td class="e-textlabel">Comments</td>
<td colspan="4">
<textarea id="Description" class="e-field e-input" name="Description" rows="3"
cols="50"
style="width: 100%; height: 60px !important; resize: vertical"></textarea>
</td>
</tr>
</tbody>
</table>
</ng-template>
</ejs-schedule>
Component :
onPopupOpen(args: PopupOpenEventArgs): void {
if (args.type === 'Editor') {
const LessonElement: HTMLInputElement = args.element.querySelector('#lessonMaster') as HTMLInputElement;
if (!LessonElement.classList.contains('e-dropdownlist')) {
const dropDownListObject: DropDownList = new DropDownList({
fields: { text: 'lesson', value: 'oid' },
placeholder: 'Choose Lesson', value: LessonElement.value,
dataSource: this.lessonData
});
dropDownListObject.appendTo(LessonElement);
LessonElement.setAttribute('name', 'lessonMaster');
}
const ArenaElement: HTMLInputElement = args.element.querySelector('#arenaMaster') as HTMLInputElement;
if (!ArenaElement.classList.contains('e-dropdownlist')) {
const dropDownListObject: DropDownList = new DropDownList({
fields: { text: 'arena', value: 'oid' },
placeholder: 'Choose Arena', value: ArenaElement.value,
dataSource: this.ArenaData
});
dropDownListObject.appendTo(ArenaElement);
ArenaElement.setAttribute('name', 'arenaMaster');
}
const startElement: HTMLInputElement = args.element.querySelector('#StartTime') as HTMLInputElement;
if (!startElement.classList.contains('e-datetimepicker')) {
// tslint:disable-next-line: no-unused-expression
new DateTimePicker({ value: new Date(startElement.value) || new Date() }, startElement);
}
const endElement: HTMLInputElement = args.element.querySelector('#EndTime') as HTMLInputElement;
if (!endElement.classList.contains('e-datetimepicker')) {
// tslint:disable-next-line: no-unused-expression
new DateTimePicker({ value: new Date(endElement.value) || new Date() }, endElement);
}
const recurElement: HTMLElement = args.element.querySelector('#RecurrenceEditor');
if (!recurElement.classList.contains('e-recurrenceeditor')) {
const recurrObject: RecurrenceEditor = new RecurrenceEditor({
});
recurrObject.appendTo(recurElement);
(this.scheduleObj.eventWindow as any).recurrenceEditor = recurrObject;
}
document.getElementById('RecurrenceEditor').style.display = (this.scheduleObj.currentAction === 'EditOccurrence') ? 'none' : 'block';
}
}
onActionBegin(args: ActionEventArgs) {
if ((args.requestType === 'eventCreate' || args.requestType === 'eventChange')) {
const eventData: any = args.data as any;
console.log('Main Event Data : ', eventData);
}
}
core.js:15723 ERROR TypeError: Cannot read property 'getTime' of undefined
at EventWindow.push../node_modules/@syncfusion/ej2-schedule/src/schedule/popups/event-window.js.EventWindow.recurrenceValidation (event-window.js:1159)
SIGN IN To post a reply.
3 Replies
HB
Hareesh Balasubramanian
Syncfusion Team
November 8, 2019 01:34 PM UTC
Hi Shabbir,
Greetings from Syncfusion Support.
We have prepared schedular sample with recurrenceRule field in editorTemplate which is working fine at our end, which can be viewed from the following link. Kindly try the below sample, if the issue still persists, please share your schedular code / try to reproduce the issue in our sample to serve you better.
Note: And also we can render the editorTemplate for schedular in Angular standard format also and the same can be viewed from the below link,
Kindly try the above samples, if you have any concerns please revert us back for further assistance.
Regards,
Hareesh
SI
Shabbir Ismail
November 19, 2019 05:32 PM UTC
Thank You so much. It works as expected.
VD
Vinitha Devi Murugan
Syncfusion Team
November 20, 2019 05:57 AM UTC
Hi Shabbir,
Thanks for your update
We are happy to hear that our solution has fulfilled your requirement.
Regards,
M. Vinitha devi
SIGN IN To post a reply.
- 3 Replies
- 3 Participants
-
SI Shabbir Ismail
- Nov 7, 2019 11:25 AM UTC
- Nov 20, 2019 05:57 AM UTC
