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
close icon

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

Hello,
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'] 
            }); 
            dropDownListObject.appendTo(statusElement); 
            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"; 
                    aa.appendChild(but); 
                } 
                document.querySelector('.e-event-delete').innerText = "Remove" 
                document.querySelector('.e-event-save').innerText = 'Ok'; 
                dialogObj.dataBind(); 
                document.querySelector('.custom').addEventListener("click", function () { alert('editor window'); }); 
 
            } 
        } 
    } 
} 
 
 
Regards, 
Karthi 



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.  
 
Regards, 
Karthi 


Loader.
Live Chat Icon For mobile
Up arrow icon