調査キーワードの横に、ジャンルIDをテーブル形式で置きたい

2024年6月8日

調査キーワードとジャンルIDをテーブル形式で表示するために、HTMLの <table> 要素を使用できます。以下は、調査キーワードとジャンルIDをテーブルで表示する例です。

html
<form method="post" action="" enctype="multipart/form-data">
    {% csrf_token %}
    
    <div class="mb-3">
        <label for="files" class="form-label">ファイルを選択してください</label>
        <input type="file" class="form-control" id="files" name="files" multiple>
    </div>

    <table class="table">
        <thead>
            <tr>
                <th>調査キーワード</th>
                <th>ジャンルID</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>
                    <input type="text" class="form-control" id="keyword" name="keyword">
                </td>
                <td>
                    <input type="text" class="form-control" id="genre_id" name="genre_id">
                </td>
            </tr>
            <!-- 他の行も必要に応じて追加 -->
        </tbody>
    </table>

    <div class="mb-3">
        <label for="store" class="form-label">調査店舗</label>
        <input type="text" class="form-control" id="store" name="store">
    </div>

    <button type="submit" class="btn btn-primary">調査開始</button>
</form>

この例では、テーブルの各行に調査キーワードとジャンルIDの入力欄があります。必要に応じて他の行を追加して、フォームを調整できます。