Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

bootstrap-select.js:797 Uncaught TypeError: Cannot read property '0' of undefined #2034

Closed
ghost opened this issue Aug 21, 2018 · 4 comments
Closed

Comments

@ghost
Copy link

ghost commented Aug 21, 2018

@Dhara-ZYMR commented on Jun 5, 2018, 9:53 AM UTC:

I am using bootstrap-select with its angularjs directive Ng-bootstrap-select

I am getting following error while scrolling through the options of the select box

    bootstrap-select.js:797 Uncaught TypeError: Cannot read property '0' of undefined
        at scroll (bootstrap-select.js:797)
        at HTMLDivElement.<anonymous> (bootstrap-select.js:738)
        at HTMLDivElement.dispatch (jquery.js:5206)
        at HTMLDivElement.elemData.handle (jquery.js:5014)

angular.js:14794 TypeError: Cannot read property '0' of undefined
    at scroll (bootstrap-select.js:797)
    at Selectpicker.createView (bootstrap-select.js:735)
    at Selectpicker.setSize (bootstrap-select.js:1684)
    at Selectpicker.refresh (bootstrap-select.js:2546)
    at HTMLSelectElement.<anonymous> (bootstrap-select.js:2612)
    at Function.each (jquery.js:362)
    at jQuery.fn.init.each (jquery.js:157)
    at jQuery.fn.init.Plugin [as selectpicker] (bootstrap-select.js:2592)
    at ng-bootstrap-select.js:294
    at Scope.$eval (angular.js:18521)

Please note following things:

  1. I am using multiple selectboxes on my page. Each select box options are based on the values selected of the previous select-box.
    I send a $http request to get the options of the select-box based on the previous box value selected.
  2. Another problem is that the dependent options also don't get refreshed when the dynamic options are fetched again for the same select-box

Trying to create a jsfiddle to demonstrate this issue.
Thanks in advance for help

This issue was moved by caseyjhol from snapappointments/bootstrap-select-temp#67.

@ghost
Copy link
Author

ghost commented Aug 21, 2018

@caseyjhol commented on Jun 5, 2018, 7:58 PM UTC:

Bug reports must include a live demo of the problem. Per our contributing guidelines, please create a reduced test case via Plunker, jsFiddle, CodePen or JS Bin, and report back with your link, Angular version, Bootstrap version, bootstrap-select version, and specific browser and OS details.

@ghost
Copy link
Author

ghost commented Aug 21, 2018

@Dhara-ZYMR commented on Aug 1, 2018, 10:07 AM UTC:

Angular version: 1.6
Bootstrap version 4
bootstrap-select version 1.13.1

As I said I have options coming in dynamically using APIs, and the options are also refreshed based on the previous select-box selection.
I tried to create a test-case but I am not able to reproduce it there.

But in my application, I have this problem everywhere I use bootstrap-select.
Any other way I can show you the issue I am facing? Like Skype or Zoom ?

@caseyjhol
Copy link
Member

Released in v1.13.4!

@esamo
Copy link

esamo commented Jan 17, 2019

I was having this error since JS libs update, then did an update of bootstrap-select to v1.13.4, but that only changed few of the errors into other ones and did not resolve the issue.

AngularJS v1.7.5.
Bootstrap v3.3.7.
Chrome v71.0.3578.98.

It happens when you call selectpicker('refresh') on select field with initiated selectpicker. No idea why. Possibly throttling or loops. I wrapped the refresh call in a self-extending timeout of 250ms that would eliminate both cases but it did not help. Sometimes these errors do not appear with the same config.

I have no ng-model set up. Most of the fields are of a multiple choice.

[updated logs]

Uncaught TypeError: Cannot read property '0' of undefined
    at i (bootstrap-select.js:2757)
    at u.createView (bootstrap-select.js:2757)
    at u.setSize (bootstrap-select.js:2757)
    at u.refresh (bootstrap-select.js:2757)
    at HTMLSelectElement.<anonymous> (bootstrap-select.js:2757)
    at Function.each (jquery-3.3.1.min.js?1784456433:2)
    at e.fn.init.each (jquery-3.3.1.min.js?1784456433:2)
    at e.fn.init.f [as selectpicker] (bootstrap-select.js:2757)
    at common.js?1784456433:1231

i | @ | bootstrap-select.js:2757
-- | -- | --
  | createView | @ | bootstrap-select.js:2757
  | setSize | @ | bootstrap-select.js:2757
  | refresh | @ | bootstrap-select.js:2757
  | (anonymous) | @ | bootstrap-select.js:2757
  | each | @ | jquery-3.3.1.min.js?1784456433:2
  | each | @ | jquery-3.3.1.min.js?1784456433:2
  | f | @ | bootstrap-select.js:2757
  | (anonymous) | @ | common.js?1784456433:1231
  | setTimeout (async) |   |  
  | selectFieldOptionsFix | @ | common.js?1784456433:1230
  | (anonymous) | @ | app_directives.js?1784456433:886
  | $digest | @ | angular.min.js?1784456433:151
  | $apply | @ | angular.min.js?1784456433:155
  | (anonymous) | @ | angular.min.js?1784456433:22
  | invoke | @ | angular.min.js?1784456433:45
  | c | @ | angular.min.js?1784456433:22
  | Tc | @ | angular.min.js?1784456433:22
  | xe | @ | angular.min.js?1784456433:21
  | (anonymous) | @ | angular.min.js?1784456433:346
  | l | @ | jquery-3.3.1.min.js?1784456433:2
  | c | @ | jquery-3.3.1.min.js?1784456433:2
  | setTimeout (async) |   |  
  | (anonymous) | @ | jquery-3.3.1.min.js?1784456433:2
  | u | @ | jquery-3.3.1.min.js?1784456433:2
  | fireWith | @ | jquery-3.3.1.min.js?1784456433:2
  | fire | @ | jquery-3.3.1.min.js?1784456433:2
  | u | @ | jquery-3.3.1.min.js?1784456433:2
  | fireWith | @ | jquery-3.3.1.min.js?1784456433:2
  | ready | @ | jquery-3.3.1.min.js?1784456433:2
  | _ | @ | jquery-3.3.1.min.js?1784456433:2
Uncaught TypeError: Cannot read property 'data' of undefined
    at u.render (bootstrap-select.js:2757)
    at u.init (bootstrap-select.js:2757)
    at new u (bootstrap-select.js:2757)
    at HTMLSelectElement.<anonymous> (bootstrap-select.js:2757)
    at Function.each (jquery-3.3.1.min.js?1784456433:2)
    at e.fn.init.each (jquery-3.3.1.min.js?1784456433:2)
    at e.fn.init.f [as selectpicker] (bootstrap-select.js:2757)
    at common.js?1784456433:1231

render | @ | bootstrap-select.js:2757
-- | -- | --
  | init | @ | bootstrap-select.js:2757
  | u | @ | bootstrap-select.js:2757
  | (anonymous) | @ | bootstrap-select.js:2757
  | each | @ | jquery-3.3.1.min.js?1784456433:2
  | each | @ | jquery-3.3.1.min.js?1784456433:2
  | f | @ | bootstrap-select.js:2757
  | (anonymous) | @ | common.js?1784456433:1231
  | setTimeout (async) |   |  
  | selectFieldOptionsFix | @ | common.js?1784456433:1230
  | (anonymous) | @ | app_directives.js?1784456433:292
  | $digest | @ | angular.min.js?1784456433:151
  | $apply | @ | angular.min.js?1784456433:155
  | (anonymous) | @ | angular.min.js?1784456433:22
  | invoke | @ | angular.min.js?1784456433:45
  | c | @ | angular.min.js?1784456433:22
  | Tc | @ | angular.min.js?1784456433:22
  | xe | @ | angular.min.js?1784456433:21
  | (anonymous) | @ | angular.min.js?1784456433:346
  | l | @ | jquery-3.3.1.min.js?1784456433:2
  | c | @ | jquery-3.3.1.min.js?1784456433:2
  | setTimeout (async) |   |  
  | (anonymous) | @ | jquery-3.3.1.min.js?1784456433:2
  | u | @ | jquery-3.3.1.min.js?1784456433:2
  | fireWith | @ | jquery-3.3.1.min.js?1784456433:2
  | fire | @ | jquery-3.3.1.min.js?1784456433:2
  | u | @ | jquery-3.3.1.min.js?1784456433:2
  | fireWith | @ | jquery-3.3.1.min.js?1784456433:2
  | ready | @ | jquery-3.3.1.min.js?1784456433:2
  | _ | @ | jquery-3.3.1.min.js?1784456433:2

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants