Uncaught TypeError: Cannot read property 'item_add' of undefined

[stonetwig]

Hello,

I have an error when using the selectize plugin and I think it's because I am using it wrong or something but I simply can't figure out why this happens.

I have a form with some selectize and each time I choose a value I get the following error:

selectize.js:691 Uncaught TypeError: Cannot read property 'item_add' of undefined

However, the plugin still works but it is a bit annoying to get the error and since it's in the underlying selectize jquery plugin I have issues with tracking down what's causing it.

This is how I initialize the select box for example:

{{ember-selectize
      content=dnssecValues
      optionValuePath="content.key"
      optionLabelPath="content.val"
      selection=defaultValueDnssec
      value=dnssec
    }}

This is in my controller, which is static and defined there. The value is tied to a query param.

  dnssecValues: [
    {key: -1, val: "All"},
    {key: 1, val: "Domains with dnssec"}
  ],
  defaultValueDnssec: {key: -1, val: "All"},

Would appreciate any help! Am I using the plugin incorrectly?

[IAmJulianAcosta]

Could you provide full stack trace?

[stonetwig]

Sure!

selectize.js:691 Uncaught TypeError: Cannot read property 'item_add' of undefined
trigger @ selectize.js:691
self.trigger @ selectize.js:875
(anonymous function) @ selectize.js:2538
debounce_events @ selectize.js:880
addItem @ selectize.js:2493
onOptionSelect @ selectize.js:1742
(anonymous function) @ selectize.js:1236
dispatch @ jquery.js:4737
elemData.handle @ jquery.js:4549

[stonetwig]

I want to add that everything still works, I just get this error nonetheless.

[onsmith]

Are you by any chance wrapping the ember-selectize component in an if helper in your template that evaluates to false as soon as a selection is made? Because in my project I was receiving the same error, and removing the if helper got rid of the error.

[stonetwig]

I have it within an if-case but it doesn't evaluate to false.

[onsmith]

In my case, it seems to be exhibiting the following behavior:

1. A selection is made by the user.
2. Handlebars begins removing the selectize input from the DOM, since the surrounding if statement is now falsy.
3. Selectize cleans itself up and removes itself from the DOM.
4. Some leftover jQuery event for selectize is dispatched, but since selectize is already gone, it throws the error we're experiencing.

By the way, I have the exact same stack trace as you when I receive the error.

[mhadaily]

Hi, I have the same problem

Full stack trace:

selectize.js:691 Uncaught TypeError: Cannot read property 'item_add' of undefined
    at Selectize.trigger (selectize.js:691)
    at Selectize.self.trigger (selectize.js:875)
    at Selectize.<anonymous> (selectize.js:2538)
    at debounce_events (selectize.js:880)
    at Selectize.addItem (selectize.js:2493)
    at Selectize.onOptionSelect (selectize.js:1742)
    at HTMLDivElement.<anonymous> (selectize.js:1236)
    at HTMLDivElement.dispatch (jquery.js:5201)
    at HTMLDivElement.elemData.handle (jquery.js:5009)

latest version: 0.5.12

I have two {{ember-selectsize}} in one page, one is working without error and one is working with this error, although it's perfectly working and I can see the result but console shows something is wrong which doesn't make sense at all.

1- Working , No Error

{{ember-selectize content=utcHour selection=valueField optionValuePath="content.id"
                                             optionLabelPath="content.label"
                                             select-value=(action 'selectuUtc' 'offset_from') placeholder="H"}} 

2- Working, With Error in console

{{ember-selectize content=perPageList
                          value=labelField
                          selection=25 
                          class="p-a"
                          optionValuePath="content"
                          optionLabelPath="content"
                          select-value=(action 'sendPerPage') }}

I don't have any {{if}} statement at all and it doesn't return anything false.