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

EditorTemplate custom footer buttons

How can i add more buttons to the footer editor?

5 Replies

KK Karthigeyan Krishnamurthi Syncfusion Team March 11, 2019 05:00 AM UTC

S_ S_Line March 11, 2019 10:51 AM UTC

Thank you for your answer, but, i have read all these links and no one show me how to customize the footer of editor. I wont use the quick popup, only the complete editor.

Please, its possible?

KK Karthigeyan Krishnamurthi Syncfusion Team March 12, 2019 11:30 AM UTC

Dear Customer,   
Thanks for your update. 
Unlike quick popup, there is no template option to customize the detailed editor footer part. We have prepare the below sample to add custom button and custom name for default buttons in the editor footer part using PopupOpen event. 
function onPopupOpen(args) { 
    if (args.type === 'Editor') { 
        var statusElement = args.element.querySelector('#EventType'); 
        if (!statusElement.classList.contains('e-dropdownlist')) { 
            var dropDownListObject = new ej.dropdowns.DropDownList({ 
                placeholder: 'Choose status', value: statusElement.value, 
                dataSource: ['New', 'Requested', 'Confirmed'] 
            statusElement.setAttribute('name', 'EventType'); 
        var startElement = args.element.querySelector('#StartTime'); 
        if (!startElement.classList.contains('e-datetimepicker')) { 
            new ej.calendars.DateTimePicker({ value: new Date(startElement.value) || new Date() }, startElement); 
        var endElement = args.element.querySelector('#EndTime'); 
        if (!endElement.classList.contains('e-datetimepicker')) { 
            new ej.calendars.DateTimePicker({ value: new Date(endElement.value) || new Date() }, endElement); 
            var dialogObj = (args.element).ej2_instances[0]; 
            if (args.target !== undefined) { 
                if (document.querySelector('.custom') === null) { 
                    aa = document.querySelector('.e-footer-content'); 
                    var but = document.createElement('button'); 
                    but.className = "custom"; 
                    but.innerText = "custom"; 
                document.querySelector('.e-event-delete').innerText = "Remove" 
                document.querySelector('.e-event-save').innerText = 'Ok'; 
                document.querySelector('.custom').addEventListener("click", function () { alert('editor window'); }); 

S_ S_Line March 12, 2019 11:38 AM UTC

Thank you Karthi 

KK Karthigeyan Krishnamurthi Syncfusion Team March 13, 2019 03:30 AM UTC

Dear Customer,    
Thanks for your update.  

Live Chat Icon For mobile
Up arrow icon