Django フォーム表示 CharField

CharField 指定なし

name = forms.CharField()

次のように表示されます。

CharField label 項目指定

name = forms.CharField(label="項目")

次のように表示されます。

CharField 初期値の設定

name = forms.CharField(label="初期値", initial="データ")

次のように表示されます。

表示時にinitialで指定した文字列があらかじめ入力された状態となります。

CharField パスワード入力

name = forms.CharField(label = "パスワード", widget=forms.PasswordInput())

次のように表示されます。

入力データが隠蔽されます。

CharField 入力を不可

name = forms.CharField(label = "入力不可", disabled=True, initial="データ")

次のように表示されます。

テキストボックスが非選択色となり、内容の変更が不可となります。

CharField 入力不可状態で背景色を変更させない

CSSで設定を行い、それを読み込んで実現することになります。

form.py側

name = forms.CharField(label = "入力不可", disabled=True, widget=forms.TextInput(attrs={'class': "back_normal"}), initial="データ")

CSS側

.back_normal{
    background-color: white;
}

次のように表示されます。

単純に背景色を通常の背景色を指定しているだけです。

CharField 枠表示をなくす

CSSで設定を行い、それを読み込んで実現することになります。

form.py側

name = forms.CharField(label = "枠なし", widget=forms.TextInput(attrs={'class': "no_frame"}), initial="データ")

CSS側

.back_normal{
    background-color: white;
}

次のように表示されます。

枠をなくすことで、ラベル表示のようにすることが可能です。
ただこの状態だと単純に枠がなくなっただけで、入力自体は可能な状態となっています。
前項で紹介している入力を不可とする手法と組み合わせると良いでしょう。

CharField テキストエリア(textarea)

name = forms.CharField(label = "テキストエリア", widget=forms.Textarea())

次のように表示されます。

CharField テキストエリア(textarea)の初期サイズの変更

name = forms.CharField(label = "テキストエリア", widget=forms.Textarea(attrs={'rows':5, 'cols':80}))

次のように表示されます。

CharField テキストエリア(textarea)のサイズ変更操作を不可としたい

CSSで設定を行い、それを読み込んで実現することになります。

form.py側

name = forms.CharField(label = "テキストエリア", widget=forms.Textarea(attrs={"class": "no_resize"}))

CSS側

.no_resize{
    resize: none;
}

次のように表示されます。

右下部分のサイズ変更可能を示すツマミ部分が非表示化され、実際に変更も不可となります。

コメント