CODEWITHSUNDEEP
angularjstwitter-bootstrapangular-ui-bootstrapbootstrap-4angular-ui
Adrian Pop
Adrian Pop

Reputation: 1967

ui.bootstrap.accordion not working with Bootstrap v4

I tried using the accordion from https://angular-ui.github.io/bootstrap/#!#accordion and after hours of trying and not getting the desired results, I changed the bootstrap version from 4.0.0 to 3.0.0 and everything showed up perfectly. With v4, I get this:

enter image description here

Only some clickable text, like a href tag. By clicking on it, sometimes it shows the content, sometimes not. I used this: 

<uib-accordion close-others="oneAtATime">
<div uib-accordion-group class="mt-1" heading="Online friends" is-open="true">
</div>
<div uib-accordion-group class="mt-1" heading="Offline friends" is-open="false">
</div>
</uib-accordion>

Additional info:

What could be the problem?

Upvotes: 0

Views: 833

Answers (1)

WebDevBooster
WebDevBooster

Reputation: 14964

What could be the problem?

Bootstrap 4 is almost a complete rewrite of Bootstrap 3.

So, the two versions are completely incompatible with each other.

You cannot use Bootstrap 3 code with Bootstrap 4 css and vice versa.

Reference:

https://getbootstrap.com/docs/4.0/migration/

Bootstrap 4 accordion docs:

https://getbootstrap.com/docs/4.0/components/collapse/#accordion-example

Upvotes: 2

Related Questions