django - ジャンゴのラジオボタンをカスタマイズする

Question

テンプレートコードは

{{ form.incident_live }}

フォーム.py

INCIDENT_LIVE = (
    ('0', 'Live'),
    ('1', 'Test'),
)
class IncidentForm(forms.ModelForm):
     incident_live = forms.ChoiceField(widget=forms.RadioSelect(),choices=INCIDENT_LIVE)

上記のコードは、垂直方向の選択肢を持つラジオボタンを私に与えていますが、私はそれを水平にしたいです。つまり、同等のhtmlは<input type="radio" name="status" />Live <input type="radio" name="status" checked="checked"/> Test.

前もって感謝します

Answer 1

カスタム ウィジェット レンダラーの仕事のように聞こえます。

from django.utils.safestring import mark_safe

class HorizRadioRenderer(forms.RadioSelect.renderer):
    """ this overrides widget method to put radio buttons horizontally
        instead of vertically.
    """
    def render(self):
            """Outputs radios"""
            return mark_safe(u'\n'.join([u'%s\n' % w for w in self]))

class IncidentForm(forms.ModelForm):
     incident_live = forms.ChoiceField(widget=forms.RadioSelect(renderer=HorizRadioRenderer),choices=INCIDENT_LIVE)

https://wikis.utexas.edu/display/~bm6432/Django-Modifying+RadioSelect+Widget+to+have+horizo​​ntal+buttonsから取得

Answer 2

user12379095からインスピレーションを得て、ラジオを Bootstrap で動作させるためにこれを思いつきました。HTMLやCSSに疎い私のような方の参考になれば。これはBoostrap 5、Django 3.1.6を使用しています:

forms.py で:

from django import forms

class ExampleForm(forms.Form):
    choice = forms.ChoiceField(
        label = 'test',
        choices = zip([1,2,3], ['a','b','c']),
        widget = forms.RadioSelect(
            attrs = {'class' : 'form-check-input'}
        )
    )

HTMLテンプレートで：

        {% for field in form.visible_fields %}
            {{ field.errors }}
            {% for radio in field %}
                <div class="form-check form-check-inline">
                    {{ radio }}
                </div>
            {% endfor %}
        {% endfor %}