sehmaschine / django-grappelli

A jazzy skin for the Django Admin-Interface (official repository).
http://www.grappelliproject.com
Other
3.77k stars 657 forks source link

forms.RadioSelect stacks choices vertically instead of horizontally #1034

Closed kenricci closed 1 year ago

kenricci commented 1 year ago

admin.py

class OTReqQuestionAdminForm(forms.ModelForm):
    class Meta:
        model = OTReqQuestion
        fields = '__all__'

    def __init__(self, *args, **kwargs):
        super(OTReqQuestionAdminForm, self).__init__(*args, **kwargs)
        self.fields['answer'].widget = forms.RadioSelect(choices=((1, 'Yes'), (0, 'No'), (3, 'N/A'),))

Grappelli 3.0.8 with Django 4.0.10 stacks choices vertically as shown here vertical_stack

Grappelli 2.13.3 with Django 2.2.10 stacks horizontally as shown here horizontal_stack

sehmaschine commented 1 year ago

you are aware that you already opened a ticket? see #1021 ... fixed with stable/3.0.x

kenricci commented 1 year ago

This is different as it is using a forms widget with an inline

On Wed, Oct 18, 2023, 8:23 a.m. Patrick Kranzlmueller < @.***> wrote:

you are aware that you already opened a ticket? see #1021 https://github.com/sehmaschine/django-grappelli/issues/1021 ... fixed with stable/3.0.x

— Reply to this email directly, view it on GitHub https://github.com/sehmaschine/django-grappelli/issues/1034#issuecomment-1768727427, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAU6TYUI3OV2UFT3QHONKT3X77X6XAVCNFSM6AAAAAA6FWTPEWVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMYTONRYG4ZDONBSG4 . You are receiving this because you authored the thread.Message ID: @.***>

kenricci commented 1 year ago

working html

<div class="grp-td answer">
  <ul id="id_otreqquestion_set-0-answer">
    <li>
      <label for="id_otreqquestion_set-0-answer_0"
        ><input
          type="radio"
          name="otreqquestion_set-0-answer"
          value="1"
          id="id_otreqquestion_set-0-answer_0"
        />
        Yes</label
      >
    </li>
    <li>
      <label for="id_otreqquestion_set-0-answer_1"
        ><input
          type="radio"
          name="otreqquestion_set-0-answer"
          value="0"
          id="id_otreqquestion_set-0-answer_1"
        />
        No</label
      >
    </li>
    <li>
      <label for="id_otreqquestion_set-0-answer_2"
        ><input
          type="radio"
          name="otreqquestion_set-0-answer"
          value="3"
          id="id_otreqquestion_set-0-answer_2"
          checked=""
        />
        N/A</label
      >
    </li>
  </ul>
</div>

Broken html

<div class="grp-td answer">
  <div id="id_otreqquestion_set-0-answer">
    <div>
      <label for="id_otreqquestion_set-0-answer_0"
        ><input
          type="radio"
          name="otreqquestion_set-0-answer"
          value="1"
          id="id_otreqquestion_set-0-answer_0"
        />
        Yes</label
      >
    </div>
    <div>
      <label for="id_otreqquestion_set-0-answer_1"
        ><input
          type="radio"
          name="otreqquestion_set-0-answer"
          value="0"
          id="id_otreqquestion_set-0-answer_1"
        />
        No</label
      >
    </div>
    <div>
      <label for="id_otreqquestion_set-0-answer_2"
        ><input
          type="radio"
          name="otreqquestion_set-0-answer"
          value="3"
          id="id_otreqquestion_set-0-answer_2"
          checked=""
        />
        N/A</label
      >
    </div>
  </div>
</div>
kenricci commented 1 year ago

Appears to be in TabularInline forms

parsch commented 1 year ago

The new html that only uses div cannot be layouted differently by default because it does not have a specific attribute. If you define the CSS class "radiolist inline" for the widget, the list will also appear as such (but you will almost certainly have to define a width for the list as well).

radiolist_tabularinline