data-role="calendarpicker" creation error

[TorakikiSan]

Hi Olton!

In JS console (Firefox) if a data-role="calendarpicker" field is present, I get this error:

Metro 4 - v4.5.0. Built at: 23/02/2021 19:05:17 metro.js:7377:25
m4q - v1.0.10. Built at 08/01/2021 14:20:31 metro.js:7378:25
Error creating component calendarpicker for  
<input id="DATA_COMPILED" class="input-small" name="data_compiled" data-role="calendarpicker" data-cls-calendar-header="bg-crimson" data-cls-calendar="compact" data-clear-button="true" data-validate="required" data-format="%d/%m/%Y" data-input-format="%d/%m/%Y" data-cls-input="text-bold text-center" data-label="Compiled" data-cls-label="text-bold fg-crimson" value="31/12/2020" data-role-calendarpicker="true" type="text" autocomplete="off" readonly="true">
metro.js:7585:42
Uncaught Error: Invalid date
    g metro.js:92
    v metro.js:81
    from metro.js:763
    _createStructure metro.js:12552
    _create metro.js:12511
    _createExec metro.js:7784
    _super metro.js:7734
    init metro.js:12496
    e/t.fn[i]/< metro.js:7599
    each metro.js:3827
    each metro.js:3826
    each metro.js:3841
    i metro.js:7598
    initWidgets metro.js:7564
    initWidgets metro.js:7557
    each metro.js:3827
    each metro.js:3826
    initWidgets metro.js:7548
    init metro.js:7502
    <anonymous> metro.js:7897
metro.js:92:18

Can help me?

Thank's!

[xscode-auto-reply]

Thanks for opening a new issue. The author has been notified and will review it as soon as possible.
For urgent issues and priority support, visit https://xscode.com/olton/Metro-UI-CSS or Patreon

[olton]

Thank you for a report, I fixed this bug. Please check it.

[olton]

https://codepen.io/olton/pen/dyOePPR?editors=1000
Important! I change the date format parser. Now you must use:

<input id="DATA_COMPILED"
               class="input-small"
               name="data_compiled"
               data-role="calendarpicker"
               data-cls-calendar-header="bg-crimson"
               data-cls-calendar="compact"
               data-clear-button="true"
               data-validate="required"
               data-cls-input="text-bold text-center"
               data-label="Compiled"
               data-cls-label="text-bold fg-crimson"
               type="text"
               autocomplete="off"
               readonly

               data-value="31/12/2020"
               data-format="DD/MM/YYYY"
               data-input-format="DD/MM/YYYY"

        >