Bagaimana cara membuat accordion di tabel? Berikut ini adalah contohnya:
<table class="table table-bordered table-hover dTable">
<thead>
<tr>
<th class="txt-c" width="20%">NO.AKUN</th>
<th class="txt-c" width="35%">NAMA AKUN</th>
<th class="txt-c" width="30%">KETERANGAN</th>
<th class="txt-c" width="15%">AKSI</th>
</tr>
</thead>
<tbody>
<tr>
<td class="txt-c">1.0.0.00.00</td>
<td class="txt-l">Aset</td>
<td class="txt-l">Keterangan 1</td>
<td class="txt-c">
<?php
echo '<a href="' . site_url('akun/edit') . '"><button type="button" class="btn btn-primary" title="Edit Akun"><i class="fa fa-edit"></i></button></a>
<a href="#"><button type="button" class="btn btn-danger" title="Hapus Akun"><i class="fa fa-remove"></i></button></a>';
?>
</td>
</tr>
<tr data-toggle="collapse" data-target="#demo1" class="accordion-toggle pointer">
<td class="txt-c">1.1.0.00.00</td>
<td class="txt-l">Aset Lancar</td>
<td class="txt-l">Keterangan 2</td>
<td class="txt-c">
<?php
echo '<a href="' . site_url('akun/edit') . '"><button type="button" class="btn btn-primary" title="Edit Akun"><i class="fa fa-edit"></i></button></a>
<a href="#"><button type="button" class="btn btn-danger" title="Hapus Akun"><i class="fa fa-remove"></i></button></a>';
?>
</td>
</tr>
<tr>
<td colspan="12" class="hiddenRow">
<div class="accordian-body collapse" id="demo1">
<table class="table table-bordered table-striped" style="width: 100%">
<tr>
<td class="txt-c" width="20%" style="border-left: none !important;">1.1.1.00.00</td>
<td class="txt-l" width="35%">Kas</td>
<td class="txt-l" width="30%">Keterangan 2.1</td>
<td class="txt-c" width="15%" style="border-right: none !important;">
<?php
echo '<a href="' . site_url('akun/edit') . '"><button type="button" class="btn btn-primary" title="Edit Akun"><i class="fa fa-edit"></i></button></a>
<a href="#"><button type="button" class="btn btn-danger" title="Hapus Akun"><i class="fa fa-remove"></i></button></a>';
?>
</td>
</tr>
<tr>
<td class="txt-c" width="20%" style="border-left: none !important;">1.1.2.00.00</td>
<td class="txt-l" width="35%">Investasi Jangka Pendek</td>
<td class="txt-l" width="30%">Keterangan 2.2</td>
<td class="txt-c" width="15%" style="border-right: none !important;">
<?php
echo '<a href="' . site_url('akun/edit') . '"><button type="button" class="btn btn-primary" title="Edit Akun"><i class="fa fa-edit"></i></button></a>
<a href="#"><button type="button" class="btn btn-danger" title="Hapus Akun"><i class="fa fa-remove"></i></button></a>';
?>
</td>
</tr>
</table>
</div>
</td>
</tr>
</tbody>
</table>
Sekian, terimakasih atas kunjungannya.
Salam,
PHP Aku : Membangun web terorganisasi dan mudah dimengerti, contoh tutorial dengan menggunakan HTML, CSS, JavaScript, SQL, PHP, dan XML.