Bootstrap - Collapsible / Accordion

3' part accordion

Nedenfor kode til en effektiv accordion fra 3'part. Kan tilsyneladende uden problemer anvendes sammen med Bootstrap.

<div id='accordion'> --- </div> indsættes udenom hele den kodeblok, der skal levere data til harmonikaen. (Linker til jquery-eventet)

accordion-toggle indsættes i harmonikaens header-linie.

<div class='accordion-content'> --- </div> indsættes udenom harmonikaens body-del.

<script type="text/javascript">
$(document).ready(function($) {
    $('#accordion').find('.accordion-toggle').click(function(){

       //Expand or collapse this panel
       $(this).next().slideToggle('fast');

       //Hide the other panels
       $(".accordion-content").not($(this).next()).slideUp('fast');

    });
});
</script>

<style>
    .accordion-toggle {cursor: pointer;}
    .accordion-content {display: none;}
    .accordion-content.default {display: block;}
</style>

<?php
    $query2 = "select * from stammenu order by stm_niveau01, stm_niveau02, stm_niveau03, stm_niveau04 asc ";
    $result2 = mysqli_query($db_link, $query2) or die(mysqli_error($db_link));

    echo "<div id='accordion'>";

       while ($row2 = mysqli_fetch_assoc ($result2))
       {
          $kat = $row2['stm_niveau01']. " | ". $row2['stm_niveau02']. " | ". $row2['stm_niveau03']. " | " . $row2['stm_niveau04']."<br />";
          echo "<span class ='bgfg accordion-toggle'>" .$kat . "</span>";

          $query3 = "select dok_titel, dok_fil from dokstam where fk_doty_id = $row2[stm_id]";
          $result3 = mysqli_query($db_link, $query3) or die(mysqli_error($db_link));
          echo "<div class='accordion-content'>";
             while ($row3 = mysqli_fetch_assoc ($result3))
             {
             $dokfil = $row3['dok_fil'];
             $file_dest = "'$dok_site$dokfil.'";
             $doknavn = " ,'navn' ";
             // $slet_dok ='.$doknavn.'.close();
             $slet_dok ="navn.close();";

             echo '<button class="btn btn-success btn-xs" onClick=" window.open(' . $file_dest. $doknavn . ' )" >Vis dok.</button>   ';
             echo $row3['dok_titel']. "<br />";
             } // while 3
          echo "</div>"; // slut accordion-content
       } //while 2
    echo "</div>"; // slut accordion

?>