1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

HTMLのselect文、データベースから値を取り出して選択済みにする

Posted at

Flaskを使用して店舗情報を管理するWEBアプリケーションを作成していた際、
データを打ち間違えた際、アップデートページを作りたいと思いました。
しかし、タグで複数の値を扱っていた為、また初めから選択していると元々入力していた値を忘れてしまいます。
そこで、元々入力していた値を忘れないように初期値としてデータベースから取り出す方法を探し出しました。

最終的にたどり着いた答えはselectタグの中で一つづつ確認させるという方法です。
データベース(data)から取り出してきた初期値にしたいカラムを(list)とすると、
###update pageのHTML(jinja2)

<form>
    <label>リスト</label>
    <select name="list" multiple>
        <option value="北海道" {% if "北海道" in data.list %}selected{% endif %}>北海道</option>
        <option value="青森県" {% if "青森県" in data.list %}selected{% endif %}>青森県</option>
        <option value="岩手県" {% if "岩手県" in data.list %}selected{% endif %}>岩手県</option>
        <option value="宮城県" {% if "宮城県" in data.list %}selected{% endif %}>宮城県</option>
        <option value="秋田県" {% if "秋田県" in data.list %}selected{% endif %}>秋田県</option>
        <option value="山形県" {% if "山形県" in data.list %}selected{% endif %}>山形県</option>
        <option value="福島県" {% if "福島県" in data.list %}selected{% endif %}>福島県</option>
           ・・・・・・・・・・・・・・・・
    </select>
</form>

とすると、元々選択していた値を忘れずに初期値として選択された状態にします。

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?