search

tempusdominus / bootstrap-4

Tempus Dominus Bootstrap 4 Datetime Picker
https://getdatepicker.com/5-4/
MIT License
611 stars 239 forks source link

"Uncaught TypeError: this.show is not a function" occurs in when user presses the down arrow. #112

Open Reboot4X opened 6 years ago

Reboot4X commented 6 years ago

Problem: "Uncaught TypeError: this.show is not a function" occurs in when user presses the down arrow after text field is clicked (receives focus)

Area of code: 

        down: function down() {
            if (!this.widget) {
                this.show();
                return false;
            }

Steps to recreate:

  1. Navigate to the jsfiddle link provided for bug report testing.

https://jsfiddle.net/Eonasdan/bdxss6m8/

Alternately, you can recreate this by navigating to the TempusDominus usage page.

https://tempusdominus.github.io/bootstrap-4/Usage/

  1. Click on the text area that is to the left of the calendar button on the jsfiddle or the usage page's 1st example (Minimum Setup)

  2. Press the down arrow key on the keyboard

Expected Result:

No error should occur when pressing the down arrow key, even if the calendar button has not been pressed.

Actual Result:

A script error occurs with the following stack trace: 

tempusdominus-bootstrap-4.js:157 Uncaught TypeError: this.show is not a function
    at Boolean.down (tempusdominus-bootstrap-4.js:157)
    at TempusDominusBootstrap4._keydown (tempusdominus-bootstrap-4.js:693)
    at Function._jQueryHandleThis (tempusdominus-bootstrap-4.js:2687)
    at r.fn.init._jQueryInterface [as datetimepicker] (tempusdominus-bootstrap-4.js:2694)
    at HTMLInputElement.<anonymous> (tempusdominus-bootstrap-4.js:2738)
    at HTMLDocument.dispatch (jquery-3.2.1.slim.min.js:3)
    at HTMLDocument.q.handle (jquery-3.2.1.slim.min.js:3)

There's also a script warning in Chrome when I access a page with the TempusDominus control:

Not sure if it is complaining about the initial states of the fields which are blank (before the user presses the calendar button) 

moment-with-locales.min.js:1 Deprecation warning: value provided is not in a recognized RFC2822 or ISO format. moment construction falls back to js Date(), which is not reliable across all browsers and versions. Non RFC2822/ISO date formats are discouraged and will be removed in an upcoming major release. Please refer to http://momentjs.com/guides/#/warnings/js-date/ for more info.
Arguments: 
[0] _isAMomentObject: true, _isUTC: false, _useUTC: false, _l: undefined, _i: 12/25/2013, _f: undefined, _strict: undefined, _locale: [object Object]
Error
    at Function.createFromInputFallback (https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.19.4/moment-with-locales.min.js:1:3173)
    at https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.19.4/moment-with-locales.min.js:1:14374
    at https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.19.4/moment-with-locales.min.js:1:14425
    at ce (https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.19.4/moment-with-locales.min.js:1:14715)
    at https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.19.4/moment-with-locales.min.js:1:15105
    at Ye (https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.19.4/moment-with-locales.min.js:1:15167)
    at ye (https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.19.4/moment-with-locales.min.js:1:15199)
    at e (https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.19.4/moment-with-locales.min.js:1:202)
    at HTMLDocument.<anonymous> (https://tempusdominus.github.io/bootstrap-4/Usage/:398:25)
    at j (https://code.jquery.com/jquery-3.2.1.slim.min.js:2:30203)
binhphanduc commented 6 years ago

yup, I met the same error with "tempusdominus-bootstrap-4": "5.0.0-alpha14" and "tempusdominus-bootstrap-4": "5.0.1" versions

Jhulianogs commented 2 years ago

I got the same problem but not trying to perform this test. In my case, when clicking on an element (a or button) the same error appeared. After racking my brains, I found out that the conflict was occurring because of a dataset that was data-id that existed in that link/button, so I changed it from data-id to data-user and the problem no longer occurred. Hope this helps someone.