php - Bootstrap 4 Collapse are opening all items together

Question

I have a dynamic page where Bootstrap Collapse is showing data from the database. Here if I click any link all the items's collapse is opening all together and closing altogether. My Code

<?php             
    while ($row = mysqli_fetch_assoc($notice)) {
?>

<div class="panel-group" id="accordion6" role="tablist" aria-multiselectable="true">
    <div class="panel panel-default">
        <div class="panel-heading" role="tab" id="headingOne6">
            <h4 class="panel-title">
                <a role="button" data-toggle="collapse" data-parent="#accordion6" href="#collapseOne6" aria-expanded="true" aria-controls="collapseOne6">
                    <?php echo $row['title']; ?>
                </a>
            </h4>
        </div>
        <div id="collapseOne6" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingOne6">
            <div class="panel-body">
                <?php echo $row['description']; ?>
            </div>
        </div>
    </div>
</div>

 <?PHP }?>

Answer 1

Your id's need to be different for each dropdown.

<a role="button" data-toggle="collapse" data-parent="#accordion6" href="#collapseOne6" aria-expanded="true" aria-controls="collapseOne6">
    <?php echo $row['title']; ?>
</a>

Above each id matches #accordion6. So any other dropdowns need to be unique. Example #accordion7, #accordion8, etc.