Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Checkbox not visible #261

Open
PaoloC68 opened this issue Nov 3, 2017 · 8 comments
Open

Checkbox not visible #261

PaoloC68 opened this issue Nov 3, 2017 · 8 comments

Comments

@PaoloC68
Copy link

PaoloC68 commented Nov 3, 2017

I am using checkboxes in a model which is using the django-multiselectfield field.
It is almost all fine except that the actual input checkbox is hidden by the css and cannot be set.
What can I do to render the input instead of having it hidden?

Thanks

screen shot 2017-11-02 at 21 06 33

@PaoloC68
Copy link
Author

PaoloC68 commented Nov 3, 2017

The issue is that with django 1.9 the input tag is wrapped into the label as can be seen here
So I had to override that renderer.

Example:



class CustomChoiceInput(ChoiceInput):
    def render(self, name=None, value=None, attrs=None, choices=()):
        if self.id_for_label:
            label_for = format_html(' for="{}"', self.id_for_label)
        else:
            label_for = ''
        attrs = dict(self.attrs, **attrs) if attrs else self.attrs
        return format_html('{}<label{}> {}</label>', self.tag(attrs), label_for, self.choice_label)


class CustomCheckboxChoiceInput(CustomChoiceInput):
    input_type = 'checkbox'

    def __init__(self, *args, **kwargs):
        super(CustomCheckboxChoiceInput, self).__init__(*args, **kwargs)
        self.value = set(force_text(v) for v in self.value)

    def is_checked(self):
        return self.choice_value in self.value


class CustomCheckboxFieldRenderer(ChoiceFieldRenderer):
    choice_input_class = CustomCheckboxChoiceInput


class TriggerAdminForm(forms.ModelForm):
    class Meta:
        model = Trigger
        exclude = []
        widgets = {
            'thresholds': CheckboxSelectMultiple(renderer=CustomCheckboxFieldRenderer),
            'conditions': CheckboxSelectMultiple(renderer=CustomCheckboxFieldRenderer),
            'actions': CheckboxSelectMultiple(renderer=CustomCheckboxFieldRenderer),
        }


@SalahAdDin
Copy link
Contributor

SalahAdDin commented Nov 10, 2017

@PaoloC68 Did you see view this bug in latest versions?

@em1le
Copy link

em1le commented Jan 18, 2018

@SalahAdDin I can affirm that the bug is still on version 1.10

@SalahAdDin
Copy link
Contributor

Really? Have you any idea?

@f1nality Man?

@tehdoorsareopen
Copy link

tehdoorsareopen commented Jul 20, 2018

Here is the solution for Django 2.0 -> rewriting checkbox_option template

admin.py

from django.forms import CheckboxSelectMultiple

# Overriding standart CheckboxSelectMultiple for jet admin
class JetCheckboxSelectMultiple(CheckboxSelectMultiple):
    option_template_name = 'admin/forms/widgets/checkbox_option.html'

@admin.register(Example)
class ExampleAdmin(admin.ModelAdmin):
    formfield_overrides = {
        models.ManyToManyField: {'widget': JetCheckboxSelectMultiple},
    }

admin/forms/widgets/checkbox_option.html

{% if wrap_label %}{% include "django/forms/widgets/input.html" %}<label class="vCheckboxLabel" {% if widget.attrs.id %} for="{{ widget.attrs.id }}"{% endif %}>{% endif %}{% if wrap_label %} {{ widget.label }}</label>{% endif %}

@Sudiptoganguly
Copy link

As per your above solutions i have copy paste code but i am facing issues
i.e
models.ManyToManyField: {'widget':JetCheckboxSelectMultiple},
AttributeError: module 'competition.models' has no attribute 'ManyToManyField'

Please i need a solution urgent

@linxlunx
Copy link

linxlunx commented Nov 14, 2020

When I realized that my django admin with Jet was not rendering the checboxes, I found this issue still open here.

After trying some steps with no luck, I found that this css property below cause the checkboxes not rendered.

/jet/static/jet/css/_forms.scss

input[type=checkbox] {
  ...
  display: none;
  ...
}

So I create custom css file to override the property.

admin.py

class MyAdmin(admin.ModelAdmin):
    class Media:
        css = {
            'all': ('css/checkbox-override.css',),
        }

static/css/checkbox-override.css

input[type=checkbox] {
  display: inline;
}

With this custom css, the checkboxes will be rendered in the add and change view. But you will see double checkboxes in the list view. So I remove the label from the list view with this css.

static/css/checkbox-override.css

label[for*="checkbox"]
{
    display:none;
}

The double checkboxes will be removed from the list view. But sure, with this trick, it will only be rendered as a plain checkbox.

@chrisdevilliers
Copy link

chrisdevilliers commented Aug 20, 2021

Expanding on @tehdoorsareopen 's comment. The following works for Django 3.2.6, django-3-jet 1.0.8 and django-multiselectfield 0.1.12:

<project>/settings.py (see: docs)

INSTALLED_APPS = [
    ...
    "django.forms"
]

TEMPLATES = [
    {
        "APP_DIRS": True,
        ...
    }
]

FORM_RENDERER = "django.forms.renderers.TemplatesSetting"

<app>/admin.py

from django.forms import CheckboxSelectMultiple
from multiselectfield import MultiSelectField

class JetCheckboxSelectMultiple(CheckboxSelectMultiple):
    option_template_name = "django/forms/widgets/checkbox_option.html"

@admin.register(Example)
class ExampleAdmin(admin.ModelAdmin):
    formfield_overrides = {
        MultiSelectField: {"widget": JetCheckboxSelectMultiple}
    }

<app>/templates/django/forms/widgets/checkbox_option.html

{% include "django/forms/widgets/input.html" %}
{% if widget.wrap_label %}<label class="vCheckboxLabel"{% if widget.attrs.id %} for="{{ widget.attrs.id }}"{% endif %}> {{ widget.label }}</label>{% endif %}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

7 participants