Removing calendar icon from DateTimePicker

[Gregory Perozzo]

Hello,

In my appointment window I don't want user to select the date, only the hour. So, I did this on the StartTime property:

                var startElement = args.element.querySelector('#StartTime');

                if (!startElement.classList.contains('e-datetimepicker')) {

                    new ej.calendars.DateTimePicker({

                        strictMode: true,

                        value: new Date(startElement.value) || new Date(),

                        format: 'HH:mm',

                        change: function () {

                            if (typeof (document.getElementById("StartTime_Error")) !== 'undefined') {

                                if (document.getElementById("StartTime_Error")) {

                                    document.getElementById("StartTime_Error").style.display = "none";

                                }

                            }

                        }

                    }, startElement);

                }

But the calendar icon still appears on the DateTimePicker. Is it possible to remove it?

Thank you very much.

[Karthigeyan Krishnamurthi]

Hi Gregory, 

 

Thank you for contacting Syncfusion support. 

 

Kindly use the below CSS to hide the DatePicker control and for the same we have prepared the below sample. 

http://www.syncfusion.com/downloads/support/forum/141772/ze/Core_sample871808730 

 

<style> 

    span.e-input-group-icon.e-date-icon.e-icons { 

        display: none; 

    } 

</style> 

 

Regards, 

Karthigeyan 

[Gregory Perozzo]

Hello Karthigeyan!

Perfect!!! Working 100%.

Thank you very much.

[Karthigeyan Krishnamurthi]

Hi Gregory,  

 

We are happy that our solution fulfilled your requirement. 

 

Regards, 

Karthigeyan