• Skip to main content
  • Skip to secondary menu
  • Skip to primary sidebar
  • Skip to footer

AI活用エンジニアへの道

生成AI時代のエンジニアの生き方を考えるメディア(作成途中)

  • コラム
  • 生成AI
  • プログラミング
    • Python入門
    • Flask入門
    • Django入門
  • プロフィール
Home / プログラミング / Django / DjangoのFormの各フィールドにクラス名を設定をする

DjangoのFormの各フィールドにクラス名を設定をする

1 widgetを使ったクラス名の設定方法
2 関連記事

DjangoでFormを使っていると、Formにクラス名を設定することが必要な場合がある。
クラス名の設定方法はは、複数あるが、代表的なものとしてwidgetを使ったクラス名の設定方法がある。


widgetを使ったクラス名の設定方法

widgetを使ったクラス名の設定は、forms.pyのModelFormのMetaクラスに以下のように、widget = {'field': forms.TextInput等(attrs={'class': 'class名'})}とするだけでできる。

  • forms.py
from django import forms
from blog.models import Post, Comment

class PostForm(forms.ModelForm):
    class Meta():
        model = Post
        fields = ('author', 'title', 'text')

        widgets = {
            'title': forms.TextInput(attrs={'class': 'textinputclass'}),
            'text': forms.Textarea(attrs={'class': 'editable'})
            # cssクラスの追加(titleにtextinputclass, textにeditableクラスが追加されるようになる)
        }

これだけで、PostFormを画面上に表示した場合に、titleとtextのフィールドに対してそれぞれtextinputclassとeditableクラスが付与されるようになる。

関連記事

現役エンジニアがDjangoに関する本を5つ紹介
現役エンジニアがDjangoに関する本を5つ紹介
WindowsでDjango、Anaconda、VSCodeのインストールとDjangoを開発する環境の構築をする
WindowsでDjango、Anaconda、VSCode…
MacでDjango、Anaconda、VSCodeのインストールとDjangoを開発する環境の構築をする
MacでDjango、Anaconda、VSCodeのインス…
DjangoのFormに初期値を設定する方法
DjangoのFormに初期値を設定する方法
DjangoでModelのsave前後で処理を行うSignalのpre_save, post_saveの使い方
DjangoでModelのsave前後で処理を行うSigna…
DjangoのModelにSlugFieldを利用する。その利用方法と
DjangoのModelにSlugFieldを利用する。その…

Primary Sidebar

人気記事

  • 1
    ITエンジニアとしてスキルを高めるためのUdemy講…
  • 2
    PyCharm,IntelliJのおすすめプラグイン一覧
  • no image 3
    Python未経験だが、フリーランスの案件に採用さ…
  • 4
    アメリカのシリコンバレーでプログラミングを無…

特集記事

  • 1
    Cursorの使用のポイントとコツ(コード補完、イ…
  • 2
    ITエンジニアとしてスキルを高めるためのUdemy講…

目次

1 widgetを使ったクラス名の設定方法
2 関連記事
StartCode ロゴ
AI時代のエンジニアを最速で育てる
法人向けIT研修で即戦力を育成しています。詳しくはお問い合わせください。
▶ 詳細はこちら
Django講座
【Udemy】Django入門講座(0からDjangoを学習: Python講座つき)
受講生6500人ほどの人気講座。<strong>View, Template, Model, Cla...
詳細 ▶

Footer

利用規約