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. (Last updated on: June 24, 2019).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Strange behaviour Dropdown list added to the Editor Window

Thread ID:

Created:

Updated:

Platform:

Replies:

151094 Jan 30,2020 03:01 PM UTC Feb 3,2020 05:51 AM UTC Angular 3
loading
Tags: ejSchedule
Bob Fiering
Asked On January 30, 2020 03:01 PM UTC

Hi,

I am working with Angular version 8.2.14, ej2-angular-schedule version 17.4.43 and ej2-anguar-dropdowns 17.4.44.
In the Editor window I added a Dropdown list based on the Example shown on the Syncfusion Website.
I use the schedule in TimelineView with Resources.
When I enter an appointment for someone and select the status this value is nicely stored. When I look at other appointments the status is also nicely shown.
The strange behaviour is this:
When I open the schedule window for the first time and open an appointment the editor shows no value in the dropdownlist with the status.
When I click om the dropdown the value is shown. After that  for all other appointments the right status is shown immediately.
Until I close the scheduler window and open it again, the first appointment I open, shows an empty value in the status dropdown list.

The code in the methode that opens the Editor is the following:

onPopupOpen(args: PopupOpenEventArgs): void {
if (args.type === 'Editor') {
// Create required custom elements in initial time
if (!args.element.querySelector('.custom-field-row')) {
let row: HTMLElement = createElement('div', { className: 'custom-field-row' });
let formElement: HTMLElement = <HTMLElement>args.element.querySelector('.e-schedule-form');
formElement.firstChild.insertBefore(row, args.element.querySelector('.e-description-row'));
let container: HTMLElement = createElement('div', { className: 'custom-field-container' });
let inputEle: HTMLInputElement = createElement('input', {
className: 'e-field', attrs: { name: 'StatusCode' }
}) as HTMLInputElement;
container.appendChild(inputEle);
row.appendChild(container);
let dropDownList: DropDownList = new DropDownList({
dataSource: this.dropDownStatusList,
fields: { text: 'StatusName', value: 'StatusCode' },
value: (args.data as { [key: string]: Object }).EventType as string,
floatLabelType: 'Always', placeholder: 'Status'
});
dropDownList.appendTo(inputEle);
inputEle.setAttribute('name', 'StatusCode');
}
}
}
I also tried to define the list with static values in the definition of the new Dropdown list. But that made no difference.

Definition of eventObject is as follows:
public eventObject: EventSettingsModel = {
dataSource: this.planningEventsList,
enableTooltip: true,
tooltipTemplate: this.tooltemp,
allowAdding: true,
allowEditing: true,
allowDeleting: true,
fields: {
subject: { title: 'Onderwerp', name: 'Subject', validation: { required: true } },
startTime: { title: 'Van', name: 'StartTime', validation: { required: true } },
endTime: { title: 't/m', name: 'EndTime', validation: { required: true } },
description: { title: 'Toelichting', name: 'Description', validation: { required: true } },
isAllDay: { title: 'Hele dag', name: 'IsAllDay'},
location: { title: 'Locatie', name: 'Location', validation: { required: true }},
}
};

I hope someone can tell me what I am missing. Searched the forum and looked at examples but could not find big differences that points to a solution.

Kind regards,

Bob Fiering





Vengatesh Maniraj [Syncfusion]
Replied On January 31, 2020 09:20 AM UTC

Hi Bob Fiering, 

Greetings from Syncfusion Support. 

We have analyzed your reported problem at our end. In your shared code, the status field is added additionally in the default editor window and its value will be based on the appointment’s StatusCode like highlighted below code. So, whenever we open the editor window through appointment, the status code field has rendered with it’s given value. If you open the editor window through cells(doubleClick the cells), the status field will be rendered with no values.  

{ 
    Id: 1, 
    Subject: 'Server Maintenance', 
    StartTime: new Date(2018, 1, 11, 10, 0), 
    EndTime: new Date(2018, 1, 11, 11, 30), 
    StatusCode: 'maintenance', 
    City: 'Seattle', 
    CategoryColor: '#1aaa55', 
    TaskId: 1 
} 

If you want to set default value for StatusCode field while opening the editor window through cell double click, kindly use below code snippet. 
if (args.target.classList.contains('e-work-cells')) { 
   (document.querySelector('.custom-field-container .e-dropdownlist') as any).ej2_instances[0].value = 'normal-event'; 
} 



Kindly try the above sample and let us know if you need any further assistance with this. 

Regards, 
Vengatesh. 


Bob Fiering
Replied On January 31, 2020 02:10 PM UTC

Hello Vengatesh,

Thank you for your answer and solution.
It works perfect now.
Have a nice weekend.

Kind regards,

Bob

Vengatesh Maniraj [Syncfusion]
Replied On February 3, 2020 05:51 AM UTC

Hi Bob, 

Thanks for the update.  

We are happy that our solution has fulfilled your requirements. 

Have a great day! 

Regards, 
Vengatesh.  


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon