Why am I not able to click my InlineRadios with CrispyForms?

Viewed 55

For some reason I can't click the InlineRadio buttons that I'm creating with my crispy forms. When i click on them, nothing happens. I don't have any error messages in the console in the browser. Can someone help me figure out what is causing this?

Forms.py

class NewsEmailForm(forms.ModelForm):

class Meta:
    model = NewsEmail 
    fields = ('province', 'municipality', 'areas', 'interval', 'ad_type')
    help_texts = {
        'areas': 'Håll in cmd (mac) eller ctrl (windows) för att markera flera',
        'interval': 'Hur ofta du vill få ett mail med nya annonser i valt område.',

    }

def __init__(self, *args, **kwargs):
    super(NewsEmailForm, self).__init__(*args, **kwargs)
    self.fields['province'].required = True
    self.fields['municipality'].required = True
    self.fields["interval"].choices = list(self.fields["interval"].choices)[1:] 
    self.fields["ad_type"].choices = list(self.fields["ad_type"].choices)[1:] 
    self.helper = FormHelper()
    self.helper.layout = Layout(
        Row(
            Column('province', css_class='form-group col-2 mb-0'),
            Column('municipality', css_class='form-group col-2 mb-0 ml-4'),
            Column('areas', css_class='form-group col-3 mb-0 ml-4'),
            Column(
                InlineRadios('interval'), 
                css_class='form-group col-1 mb-0 ml-4'
            ),
            Column(
                css_class='form-group col-1 mb-0 ml-4'
            ),
            Column(
                FormActions(
                    Submit('submit', 'Spara bevakning', css_class='btn btn-sm btn-primary'),
                ), 
                css_class='form-group col-1 mt-4 mb-0 ml-4'
            ),
            
        ),
        InlineRadios('ad_type'), 
    )


    # if self.instance:
    #     # if (str(self.instance.areas) == 'core.Area.None'):
    #     #     self.fields['areas'].queryset = Area.objects.none()

    #else:
    self.fields['municipality'].queryset = Municipality.objects.none()
    self.fields['areas'].queryset = Area.objects.none()
    self.fields['areas'].required = False

    if 'province' in self.data:
        try:
            # Set municipality queryset
            province_id = int(self.data.get('province'))
            self.fields['municipality'].queryset = Municipality.objects.filter(province_id=province_id).order_by('name')
        
            # Set area queryset
            municipality_id = int(self.data.get('municipality'))
            self.fields['areas'].queryset = Area.objects.filter(municipality_id=municipality_id).order_by('name')
            
        except (ValueError, TypeError) as e:

Models.py

class NewsEmail(models.Model):

INTERVAL_CHOICES = (
    (1, "Veckovis"),
    (2, "Dagligen"),
)

AD_TYPES_CHOICES = (
    (1, "Hund erbjudes"),
    (2, "Hund sökes"),
)

user = ForeignKey(User, on_delete=models.CASCADE, null=True, blank=True)
province = ForeignKey(Province, on_delete=models.CASCADE, verbose_name='Landskap', null=True, blank=True)
municipality = ForeignKey(Municipality, on_delete=models.CASCADE, verbose_name='Kommun', null=True, blank=True)
areas = ManyToManyField(Area, verbose_name='Område', blank=True)
interval = IntegerField(choices=INTERVAL_CHOICES, null=True, blank=True, verbose_name='Intervall')
ad_type = IntegerField(choices=AD_TYPES_CHOICES, null=True, blank=True, verbose_name='Annonstyp')

Template.html

    {% extends '_base.html' %}
{% load crispy_forms_tags %}
{% load static %}

  <form method="post" enctype="multipart/form-data" id="adForm" data-municipalities-url="{% url 'ajax_load_municipalities' %}" data-areas-url="{% url 'ajax_load_areas' %}" novalidate>
    {% csrf_token %}  

    {% crispy form %}

  </form>

Image of the inspector in the browser

HTML element

2 Answers

For some reason, this seems to be caused by the following setting in my settings.py, if I remove it, things work as expected, however I want to use the bootstrap4 temlpate pack, so I've posted an issue in the Github repo:

CRISPY_TEMPLATE_PACK = 'bootstrap4'

https://github.com/django-crispy-forms/django-crispy-forms/issues/1202

The issue can be fixed by downgrading to version 1.11.0

An alternative fix is to set the widget to RadioSelect. See here.

So, in class Meta, add:

    widgets = {'ad_type': forms.RadioSelect()}
Related