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

Scheduler sample is not working

Hello
When I try sample to customize scheduler quickinfo
https://ej2.syncfusion.com/aspnetcore/documentation/schedule/editor-template/#customizing-quick-popups

To start it seems that form should have this css <form class="e-schedule-form">

But then, footer actions are working, except when I try to add an item, I get :
     Uncaught TypeError: Cannot read property 'parentElement' of null
         at t.getErrorElement (constants.js:93)
         at t.validateRules (constants.js:93)
         at t.validate (constants.js:93)
         at e.quickPopupHide (constants.js:93)
         at e.saveClick (constants.js:93)
I can't understand

Bonus :)
  1. Where can we get default quickinfo (how to get date and recurrence in the good way) ?
  2. Do you have a sample with a drop down for event creation ?
Thanks in advance.


1 Reply

VM Vengatesh Maniraj Syncfusion Team January 29, 2020 09:26 AM UTC

Hi Guillaume MOULIN, 

Greetings from Syncfusion Support. 

We have ensured the reported case at our end and it could be working fine as expected while save the event. For more reference please refer the below sample. In this sample we have add the dropdown in quick popup by making use of popupOpen events. Please refer below, 

<ejs-schedule id="schedule" height="550" selectedDate="new DateTime(2018, 2, 15)" views="@ViewBag.view" popupOpen="onPopupOpen"> 
    <e-schedule-eventsettings dataSource="@ViewBag.datasource"></e-schedule-eventsettings> 
    <e-schedule-quickinfotemplates header="#headerTemplate" content="#contentTemplate" footer="#footerTemplate"> 
    </e-schedule-quickinfotemplates> 
</ejs-schedule> 


<script type="text/javascript"> 
    function onPopupOpen(args) { 
        if (args.type === "QuickInfo" && args.target && args.target.classList.contains('e-work-cells')) { 
            let row = ej.base.createElement("div", { className: "custom-field-row" }); 
            let container = ej.base.createElement("div", { 
                className: "custom-field-container" 
            }); 
            let inputEle = ej.base.createElement("input", { 
                className: "e-field", 
                attrs: { name: "EventType" } 
            }); 
            container.appendChild(inputEle); 
            row.appendChild(container); 
            var dropDownList = new ej.dropdowns.DropDownList({ 
                dataSource: [ 
                    { text: "Public Event", value: "public-event" }, 
                    { text: "Maintenance", value: "maintenance" }, 
                    { text: "Commercial Event", value: "commercial-event" }, 
                    { text: "Family Event", value: "family-event" } 
                ], 
                fields: { text: "text", value: "value" }, 
                value: "", 
                floatLabelType: "Always", 
                placeholder: "Event Type" 
            }); 
            dropDownList.appendTo(inputEle); 
            let formElement = args.element.querySelector(".e-schedule-form"); 
            formElement.appendChild(row); 
        } 
    } 
</script> 



Kindly try the above and revert us for further assistance. 

Regards, 
Vengatesh 


Loader.
Up arrow icon