使用PHP脚本的Bootstrap Accordion无法正常工作

Question

I have written a php script which uses Bootstrap Accordion. My Problem is as follows:- Data is displayed correctly in the accordion for all records but when i click on respective accordion..none of them pop-open n close except the accordion of the very first record displayed ie only the first accordion is working perfectly fine but for rest of the records, accordion displays correct data but does not pop-open n close at all. Please help if anyone can Here is the code which i have written

            <div class="row">
                <?php while ($row = mysql_fetch_assoc($sql_result)) { ?>
                    <div class="col-sm-6">
                        <div class="card" style="width: 25rem;">
                            <h3 class="card-header card-warning text-center"><?php echo $row['dlocation'] ?></h3>
                            <img class="card-img-top img-fluid" src="<?php echo $row['dimage'] ?>" alt="Card image cap">

                            <!--ACCORDION START-->
                                <div id="accordion" role="tablist" aria-multiselectable="true">
                                  <div class="card">
                                    <div class="card-header" role="tab" id="headingOne">
                                      <h5 class="mb-0">
                                        <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
                                          Image Description
                                        </a>
                                      </h5>
                                    </div>

                                    <div id="collapseOne" class="collapse show" role="tabpanel" aria-labelledby="headingOne">
                                      <div class="card-block">
                                        <?php echo $row['dimagedescription'] ?>
                                      </div>
                                    </div>
                                  </div>
                                  <div class="card">
                                    <div class="card-header" role="tab" id="headingTwo">
                                      <h5 class="mb-0">
                                        <a class="collapsed" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
                                          Software Used
                                        </a>
                                      </h5>
                                    </div>
                                    <div id="collapseTwo" class="collapse" role="tabpanel" aria-labelledby="headingTwo">
                                      <div class="card-block">
                                        <p class="card-text"><?php echo $row['dsoftwareused'] ?></p>
                                      </div>
                                    </div>
                                  </div>
                                </div>
                                <!--ACCORDION END-->


                            <div class="card-block ">                   
                                <div class="alert alert-danger" role="alert">
                                    <p class="card-text"><?php echo $row['dimagedescription'] ?></p>
                                    <p class="card-text"><?php echo $row['dsoftwareused'] ?></p>
                                </div>
                                <h4><span class="badge badge-default">Designer Information</span></h4>
                                <h5 class="card-title"><?php echo $row['dname'] ?></h5>
                                <h6 class="card-subtitle mb-2 text-muted"><?php echo ($row['dcity'])?></h6>
                                <h6 class="card-subtitle mb-2 text-muted"><?php echo ($row['dmobile'])?></h6>
                                <h6 class="card-subtitle mb-2 text-muted"><a href="<?php echo ($row['dwebsite'])?>"><?php echo ($row['dwebsite'])?></a></h6>
                                <h6 class="card-subtitle mb-2 text-muted"><a href="mailto:<?php echo ($row['demail'])?>" target="_top"><?php echo ($row['demail'])?></a></h6>
                            </div>
                            <div class="card-footer">
                                <small class="text-muted">Design ID:- <?php echo stripcslashes($row['did']) ?> Submitted on :-<?php echo stripcslashes($row['dsubmissiondate']) ?></small>
                                <br>
                            </div>
                        </div>
                    </div>
                <?php } ?>
            </div>

Answer 1

My Problem has been solved by assigning unique Accordion ID for each record in the PHP array generated . Thank You.