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

How do I add more than one custom field to event editor?

Hi, i took a close look at this page:https://ej2.syncfusion.com/angular/documentation/schedule/editor-template/#add-additional-fields-to-the-default-editor
The example shows how to add a dropdown list. However, how can I add multiple additional fields? For example I want one extra dropdown called 'client' , but also one extra checkbox which is a boolean 'business' and another number inputfield called 'distance'.
What part of the code should I replicate in order to add multiple fields, in that onPopupOpen() function?
So I dont want just the dropDownList in below code:
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 = args.element.querySelector('.e-schedule-form');
formElement.firstChild.insertBefore(row, args.element.querySelector('.e-title-location-row'));
let container: HTMLElement = createElement('div', {className: 'custom-field-container'});
let inputEle: HTMLInputElement = createElement('input', {
className: 'e-field', attrs: {name: 'Client'}
}) as HTMLInputElement;
let dropDownList: DropDownList = new DropDownList({
dataSource: [
{text: 'Person1', value: 'Person1'},
{text: 'Person2', value: 'Person2'},
{text: 'Person3', value: 'Person3'},
{text: 'Person4', value: 'Person4'}
fields: {text: 'text', value: 'value'},
value: (<{ [key: string]: Object }>(args.data)).Client as string,
floatLabelType: 'Always', placeholder: 'Client'
inputEle.setAttribute('name', 'Client');



1 Reply

VD Vinitha Devi Murugan Syncfusion Team November 11, 2019 11:36 AM UTC

Hi Youssef, 
Syncfusion Greetings. 
Based on your shared requirement, we have prepared the sample to add dropdownlist, checkbox and input filed on default window . Please refer the below sample. 
M.Vinitha devi 

Live Chat Icon For mobile
Up arrow icon