Membuat Rowspan Dinamis dengan PHP HTML MySQL

Atribut rowspan berfungsi untuk merentangkan sel secara vertikal pada tabel di html. Rowspan biasanya digunakan untuk menggabungkan dua atau lebih sel menjadi 1. Berikut adalah contoh penggunaan atribut rowspan pada tag td.

<!DOCTYPE html>
<html>

<head>
    <title>HTML Table Rowspan</title>
</head>
<style>
    table,
    th,
    td {
        border: 1px solid black;
    }
</style>

<body>
    <table>
        <tr>
            <th>CategoryName</th>
            <th>ProductName</th>
        </tr>
        <tr>
            <td rowspan="2">Beverages</td>
            <td>Chais</td>
        </tr>
        <tr>
            <td>Chang</td>
        </tr>
        <tr>
            <td>Condiments</td>
            <td>Aniseed Syrup</td>
        </tr>
    </table>
</body>

</html>

Hasilnya:

HTML Table Rowspan

Baris ketiga yang berisi data "Chang" dihilangkan satu selnya, kemudian pada baris dua di data "Beverages" direnggangkan selnya menggunakan rowspan ke bawah. Nilai 2 di rowspan artinya sel direnggangkan sebanyak 2 baris. Ubah nilai ini jika ingin merenggangkan lebih dari dua baris.

Rowspan Dinamis

Bagaimana jika ingin membuat rowspan secara dinamis? Misalnya mengambil dari data dari database MySQL kemudian menampilkan dengan kode PHP.

  • Langkah 1 : Pastikan data diurutkan berdasarkan kolom yang ingin dikelompokkan.
  • Langkah 2 : Simpan data yang sudah diurutkan ke dalam array dengan key adalah kolom yang ingin dikelompokkan.
  • Langkah 3 : Buat perulangan untuk menampilkan data dengan mengisikan rowspan pada baris pertama sebanyak jumlah data per kelompok.

Source code Rowspan Dinamis

<!DOCTYPE html>
<html>

<head>
    <title>Rowspan Dinamis PHP MySQL HTML</title>
</head>
<style>
    table,
    th,
    td {
        border: 1px solid black;
    }
</style>

<body>
    <table border="1">
        <tr>
            <th>Kode Diagnosa</th>
            <th>Kode Gejala</th>
        </tr>
        <?php

        $conn = mysqli_connect('localhost', 'root', '', 'ds');
        $query = mysqli_query($conn, "SELECT * FROM tb_relasi ORDER BY kode_diagnosa");

        $arr = array();
        while ($row  = mysqli_fetch_object($query)) {
            $arr[$row->kode_diagnosa][] = $row;
        }
        ?>
        <?php foreach ($arr as $key => $val) : ?>
            <?php foreach ($val as $k => $v) : ?>
                <tr>
                    <?php if ($k == 0) : ?>
                        <td rowspan="<?php echo count($val) ?>">
                            <?php echo $v->kode_diagnosa ?>
                        </td>
                    <?php endif ?>
                    <td><?php echo $v->kode_gejala ?></td>
                </tr>
            <?php endforeach ?>
        <?php endforeach ?>
    </table>
</body>

</html>

Hasilnya:

Rowspan Dinamis PHP MySQL HTML

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *

This site uses Akismet to reduce spam. Learn how your comment data is processed.