Datepicker with input text mask

[Adam Mews]

Hi,

I attempted to use an text mask with datepicker component, but no success.

I've set an function to created property on datepicker to create a input text mask. The mask appears on the input, but does not work well. When i try to input some date like "02/2019" the text makes it "2/2019" and when it looses focus, it throws an error: 

Cannot read property 'className' of undefined

I tried to use theese two threads, but none of them resolved my problem. Theese two specify some property called focustOut,but i didn't find. 

https://www.syncfusion.com/forums/130340/input-mask-on-datapicker

https://www.syncfusion.com/forums/121278/how-to-make-that-after-of-lose-focus-in-datepicker-this-put-focus-in-another-element-in

Can some example with Javascript be provided?

Here is the snippet code

dtPickerInicio = new ej.calendars.DatePicker({

                    value: data.dataInicioEntradas,

                    max: moment().endOf('month')._d,

                    start: 'Year',

                    depth: 'Year',

                    format: 'MM/yyyy',

                    change: function (args) {

                        refreshDateRanges();

                    },

                    enabled: !isEdit,

                    strictMode: true,

                    created: onCreated,

                }, args.form.elements.namedItem('f_datainicio'));

function onCreated() {

        new ej.inputs.MaskedTextBox({ mask: '00/0000', placeholder: '__/____' }).appendTo(this.element);

    }

[Ashokkumar Balasubramanian]

Hi Adam Mews,

 

Good day to you. 

We have checked with your query for enabling mask for the Date Picker component input control to restrict the date entry based on the format. At present, we are not providing the masking support for the Date Picker component. We have already considered to provide this feature in any of our upcoming releases. We appreciate your patience until then.    

   

You can also track the details regarding this feature with our Feedback portal from the below link.     

   

https://www.syncfusion.com/feedback/1839/provide-mask-support-to-be-applied-in-the-input-of-the-datepicker-component   

Regards, 

Ashokkumar B. 

[Prince Oliver]

Hello Adam, 

Good day to you. 

We are glad announce that we have provided mask support for DatePicker component. Please find the below demo and documentation links below. 

Demo: https://ej2.syncfusion.com/javascript/demos/#/material/datepicker/input-mask.html 

UG documentation: https://ej2.syncfusion.com/javascript/documentation/datepicker/date-masking/ 

 

Please let us know if you need any further assistance regarding this. 

Regards, 

Prince