PHPでCSVからラジオボタンを生成する方法【サンプルコード付き】

php

PHPでCSVからラジオボタンを生成する方法

PHPでCSVファイルを読み込み、ラジオボタンの選択肢を自動生成する方法を紹介します。CSVに登録されたデータをそのままフォームへ反映できるため、選択肢の追加や変更をCSVだけで管理できます。お問い合わせフォームやアンケートフォーム、カテゴリ選択などに利用できるサンプルコードです。

コードについて 本記事のコードはサンプルコードです。ご利用前に必ず動作確認を行ってください。
免責事項 本コードの利用により発生した損害について、当サイトは一切の責任を負いません。

デモ

カテゴリを選択

選択結果:未選択

コードをコピーして使おう!

<?php

$options = [];

if (file_exists('data.csv')) {

    if (($fp = fopen('data.csv', 'r')) !== false) {

        while (($row = fgetcsv($fp)) !== false) {

            if (!empty($row[0])) {
                $options[] = $row[0];
            }

        }

        fclose($fp);

    }

}

?>

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>CSVからラジオボタン生成</title>

<style>

body{
    font-family:sans-serif;
    margin:20px;
}

.radio-wrap{
    max-width:700px;
    padding:30px;
    border:1px solid #ddd;
    border-radius:12px;
}

.radio-title{
    margin-bottom:20px;
    font-size:24px;
    font-weight:bold;
}

.radio-item{
    display:block;
    margin-bottom:16px;
    font-size:18px;
    cursor:pointer;
}

.radio-result{
    margin-top:24px;
    padding:16px;
    background:#f7f7f7;
    border:1px solid #ddd;
    border-radius:8px;
    font-weight:bold;
}

</style>

</head>
<body>

<div class="radio-wrap">

    <div class="radio-title">
        カテゴリを選択
    </div>

    <?php foreach ($options as $option): ?>

    <label class="radio-item">

        <input
            type="radio"
            name="category"
            value="<?= htmlspecialchars($option, ENT_QUOTES, 'UTF-8') ?>">

        <?= htmlspecialchars($option, ENT_QUOTES, 'UTF-8') ?>

    </label>

    <?php endforeach; ?>

    <div class="radio-result" id="radioResult">
        選択結果:未選択
    </div>

</div>

<script>

document
.querySelectorAll('input[name="category"]')
.forEach(radio => {

    radio.addEventListener('change', () => {

        document.getElementById('radioResult').textContent =
            '選択結果:' + radio.value;

    });

});

</script>

</body>
</html>

ファイル構成と設置方法

このサンプルで使用するファイル構成です。
下記のファイルを同じフォルダ(同じ階層)へ配置してください。

sample/
├─ index.php
└─ data.csv

data.csv に登録したデータを読み込み、ラジオボタンの選択肢として表示します。CSVの内容を変更すると、表示されるラジオボタンも自動的に変更されます。

サーバーへ設置する場合は、index.php と data.csv を同じフォルダへアップロードしてください。

PHPはサーバー上で実行されるため、PHPファイルをダブルクリックしても動作しません。動作確認はレンタルサーバーへアップロードするか、PHPが利用できるローカル環境で行ってください。


コメント