Skip to content
GitLab
Closed
Issue created by Administrator@rootContributor

v4 list-group not work correctly with tabs

Created by: agavazov

On V3 when I make tabs with list-group it works fine, but in V4 tabs are open once and active class does not disappear.

This example is with V3, you can see whats happen when test it with V4

<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>
</head>
<body>

<ul class="list-group">
    <li class="list-group-item active"><a href="#panel1" data-toggle="tab">Open panel 1</a></li>
    <li class="list-group-item"><a href="#panel2" data-toggle="tab">Open panel 2</a></li>
</ul>

<hr/>

<div class="tab-content">
    <div class="tab-pane active" id="panel1">
        <div class="panel-body">Panel 1 body</div>
    </div>
    <div class="tab-pane" id="panel2">
        <div class="panel-body">Panel 2 body</div>
    </div>
</div>

</body>
</html>