0

I'm adding new accordion sections to my UIKit data-uk-accordion dynamically, using ng-repeat.

<div class="uk-accordion" data-uk-accordion="{ collapse: false }">
  <h3 class="uk-accordion-title uk-active" ng-repeat-start="driver in drivers">Driver {{driver.id}}</h3>
  <div class="uk-accordion-content" ng-repeat-end>
  ...
</div>

When I add new accordion sections and I click on the title to collapse, I'm getting the following error:

TypeError: wrapper is undefined, on line 73 of accordion.js in UIkit 2.24.2: wrapper.data('toggle').toggleClass(this.options.clsactive);

I tried adding data-uk-observe to the accordion div, or its parent divs but didn't have any effect, and also tried to reinit the accordion manually by adding it an id, and running UIkit.accordion('#drivers') from console but no change.

Even tried to run UIkit.init() from console but I'm getting the same error.

Any ideas how to reinit the accordion?

orszaczky
  • 13,301
  • 8
  • 47
  • 54
  • You should initialize manually the accordion with UIkit.accordion($('#elementID'), {option: 'value'}); Omit the data-uk-accordion attribute to prevent the component from booting before. – Greg Jan 20 '16 at 08:41
  • This looks like a duplicate of http://stackoverflow.com/questions/33731080/how-to-correctly-append-dynamic-getuikit-accordions. – codermonkeyfuel Mar 11 '16 at 17:49

1 Answers1

0

It looks like what you want to do is:

  • Omit the data-uk-accordion attribute.
  • Save the object returned from calling UIkit.accordion(element, options).
  • After new accordion child elements have been added, call accordion.update(). (assuming you saved the returned object above in a variable called accordion)

For more information about how I arrived at that, check out the related issue on GitHub.

codermonkeyfuel
  • 479
  • 4
  • 11