zelenij / django-bootstrap-v5 Goto Github PK

View Code? Open in Web Editor NEW

This project forked from zostera/django-bootstrap4

103.0 5.0 44.0 2.72 MB

Bootstrap 5 integration with Django.

Home Page: https://django-bootstrap-v5.readthedocs.io/

License: BSD 3-Clause "New" or "Revised" License

Python 92.14% HTML 7.04% Makefile 0.82%

django bootstrap bootstrap5 python python3 webdevelopment

django-bootstrap-v5's People

Stargazers

Watchers

Forkers

abdulwahed-mansour lucarhee comfix get455by mick88 rhaist benjhastings konevenkatesh liqianqian160 elembivios jayson7 aleksvoronov scay fraimondo aferraz1 codymorton dimasapsay primital yokataaaa serg-bsn maradonna90 lukef0914 peter-sailer j209 ibrahimkelly exo3106 sethtanoue raselstr nerdoc gayathri333 codeyross sangnguyen1991 sshadabjdp projectsofrajii sejl getchertified legarnica oipila rsp2k rain0r math-a3k altimore wilmerm cro

django-bootstrap-v5's Issues

RadioSelectButtonGroup shows bullets?

When rendering the example from the widget docs, it looks like this:

But I think it is supposed to look like in the official BS5 docs, like this:

I think the bullets are not supposed to be there. The HTML output differs from the recommended output in the BS5 docs: the label should IMHO not enclose the input...?

Migrate to bootstrap v5

Bootstrap 5 beta 1 is out, it's time to provide integration with Django

Pypi release 1.0.11 does not support Django 5.0

The 1.0.11 release expects Django version <5.0. I don't know if there is anything actually incompatible with Django 5 but since its out now the package is broken until a new release.

Read the Docs out of date

The changelog page hasn't been built since v 1.0.0: https://django-bootstrap-v5.readthedocs.io/en/latest/changelog.html

I would guess if you check the Read the Docs web console, you'd see why the builds are failing.

This project hasn't received commits in over 2 years and an actively maintained repo for bootstrap 5 exists as well. If you're not interested in maintaining the project please consider archiving and adding the maintained repo to the README.md.

Update example project for Django 4

django.conf.urls.urls was removed in Django 4.0 and example project does not build
https://docs.djangoproject.com/en/4.0/releases/4.0/#features-removed-in-4-0

Label for checkbox still shows with show_label='False'

Change line 373 in renderers.py

 def post_widget_render(self, html):
        if isinstance(self.widget, RadioSelect):
            html = self.list_to_class(html, "radio radio-success")
        elif isinstance(self.widget, CheckboxSelectMultiple):
            html = self.list_to_class(html, "checkbox")
        elif isinstance(self.widget, SelectDateWidget):
            html = self.fix_date_select_input(html)
        elif isinstance(self.widget, CheckboxInput):
            html = self.add_checkbox_label(html)
        elif isinstance(self.widget, FileInput):
            html = self.fix_file_input_label(html)
        return html

 def post_widget_render(self, html):
        if isinstance(self.widget, RadioSelect):
            html = self.list_to_class(html, "radio radio-success")
        elif isinstance(self.widget, CheckboxSelectMultiple):
            html = self.list_to_class(html, "checkbox")
        elif isinstance(self.widget, SelectDateWidget):
            html = self.fix_date_select_input(html)
        elif isinstance(self.widget, CheckboxInput) and self.show_label:
            html = self.add_checkbox_label(html)
        elif isinstance(self.widget, FileInput):
            html = self.fix_file_input_label(html)
        return html

Incorrect layout for BS5

In bootstrap is er geen nesting in

https://getbootstrap.com/docs/5.1/forms/checks-radios/

It should be like this, and you are left as in BS4

<div class="form-check">
  <input class="form-check-input" type="radio" name="flexRadioDefault" id="flexRadioDefault1">
  <label class="form-check-label" for="flexRadioDefault1">
    Default radio
  </label>
</div>
<div class="form-check">
  <input class="form-check-input" type="radio" name="flexRadioDefault" id="flexRadioDefault2" checked>
  <label class="form-check-label" for="flexRadioDefault2">
    Default checked radio
  </label>
</div>

Now the layout has this look, but that was in BS4.

                            <div class="form-check">
                                <label for="id_symptom_1_1">
                                    <input class="is-valid"
                                           id="id_symptom_1_1"
                                           name="symptom_1" required=""
                                           title="" type="radio" value="1"/>
                                    Very Mild</label>
                            </div>

importlib-metadata version dependency?

Could importlib-metadata dependency be dropped? { version = "<3", python = "<3.9", optional = true }

E.g. twine 3.4.1 and keyring 23.0.0 require importlib-metadata>=3.6 which causes conflicts even if importlib-metadata is marked as optional in pyproject.toml

Does use translations

I can't get forms rendered with fieldnames, help_text etc translated.
Seems as if it doesn't use any of it

Cannot Deploy in PythonAnywhere

When I deploy my Django project in pythonanywhere, below error is happened. Even though it is ok in my local PC.

2022-09-14 08:51:45,879: Error running WSGI application
2022-09-14 08:51:45,887: ModuleNotFoundError: No module named 'bootstrap5'
2022-09-14 08:51:45,887: File "/var/www/userlog_pythonanywhere_com_wsgi.py", line 16, in
2022-09-14 08:51:45,887: application = get_wsgi_application()

bootstrap_form_errors template tag renders incorrect close button

The current implementation of the template tag {% bootstrap_form_errors form %} renders incorrectly a button:

<button type="button" class="close" data-dismiss="alert" aria-label="close">×</button>

instead of:

<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>

See: https://getbootstrap.com/docs/5.1/components/alerts/#dismissing

The form-check field classes are lost

After submitting and returning a form with errors, classes are lost.
form-check-label
form-check-input

<div class="form-check">
  <label for="id_symptom_22_0"><input checked="" class="is-valid" id="id_symptom_22_0" name="symptom_22" required="" title="" type="radio" value="0">
   None</label>
</div>

To convert to Radio, I use the widget in the ModelForm class

forms.RadioSelect()

Issues with Django-multiselectfield

Hello!

So this is a little bit of a hacky fix because I don't fully understand the library.

It fixed my issue for https://pypi.org/project/django-multiselectfield/
it renders as a CheckboxSelectMultiple

line 286:
add

elif isinstance(widget, CheckboxSelectMultiple):
            classes = add_css_class(classes, "form-group", prepend=True)

def add_class_attrs(self, widget=None):
        if widget is None:
            widget = self.widget
        classes = widget.attrs.get("class", "")
        if ReadOnlyPasswordHashWidget is not None and isinstance(widget, ReadOnlyPasswordHashWidget):
            # Render this is a static control
            classes = add_css_class(classes, "form-control-static", prepend=True)
        elif not isinstance(widget, self.WIDGETS_NO_FORM_CONTROL):
            classes = add_css_class(classes, "form-control", prepend=True)
            # For these widget types, add the size class here
            classes = add_css_class(classes, self.get_size_class())
        elif isinstance(widget, CheckboxInput):
            classes = add_css_class(classes, "form-check-input", prepend=True)
        elif isinstance(widget, CheckboxSelectMultiple):
            classes = add_css_class(classes, "form-group", prepend=True)
        elif isinstance(widget, Select):
            classes = add_css_class(classes, "form-select", prepend=True)

line 332:
add

for input in enclosing_div.find_all("input"):
                try:
                    if not 'form-check-input' in input.attrs.get("class"):
                        input.attrs["class"] = input.attrs.get("class", []) + ["form-check-input"]
                except AttributeError:
                    pass

def list_to_class(self, html, klass):
        classes = add_css_class(klass, self.get_size_class())
        mapping = [
            ("<ul", '<div class="{classes}"'.format(classes=classes)),
            ("</ul>", "</div>"),
            ("<li", '<div class="{form_check_class}"'.format(form_check_class=self.form_check_class)),
            ("</li>", "</div>"),
        ]
        for k, v in mapping:
            html = html.replace(k, v)

        # Apply bootstrap5 classes to labels and inputs.
        # A simple 'replace' isn't enough as we don't want to have several 'class' attr definition, which would happen
        # if we tried to 'html.replace("input", "input class=...")'
        soup = BeautifulSoup(html, features="html.parser")
        enclosing_div = soup.find("div", {"class": classes})
        if enclosing_div:
            for label in enclosing_div.find_all("label"):
                label.attrs["class"] = label.attrs.get("class", []) + ["form-check-label"]
                try:
                    label.input.attrs["class"] = label.input.attrs.get("class", []) + ["form-check-input"]
                except AttributeError:
                    pass
            for input in enclosing_div.find_all("input"):
                try:
                    if not 'form-check-input' in input.attrs.get("class"):
                        input.attrs["class"] = input.attrs.get("class", []) + ["form-check-input"]
                except AttributeError:
                    pass
        return str(soup)

line 379
change
html = self.list_to_class(html, "checkbox")

to
html = self.list_to_class(html, "form-group")

def post_widget_render(self, html):
        if isinstance(self.widget, RadioSelect):
            html = self.list_to_class(html, "radio radio-success")
        elif isinstance(self.widget, CheckboxSelectMultiple):
            html = self.list_to_class(html, "form-group")
        elif isinstance(self.widget, SelectDateWidget):
            html = self.fix_date_select_input(html)
        elif isinstance(self.widget, CheckboxInput) and self.show_label:
            html = self.add_checkbox_label(html)
        elif isinstance(self.widget, FileInput):
            html = self.fix_file_input_label(html)
        return html

renderers.py.txt

Merge with django-bootstrap5

As there are 2 almost identical projects, both forked from django-bootstrap4, this only confuses users which is the "official" project.

I would strongly suggest you have a talk with @zostera and merge these 2 projects (preferrably into zostera's django-bootstrap5).

Support the CheckboxSelectMultiple widget for ManyToManyField

Feature request: add support the CheckboxSelectMultiple widget for ManyToManyField. Currently, if you try to use it in a form, it looks very strange and doesn't work.

This is what it looks like if you attempt to use the CheckboxSelectMultiple widget:

is-valid class applied to fields unexpectedly

I have the following form included in a template; however, all the is-valid class is applied to all fields automatically, by default. I cannot seem to find a reason why this class is applied. Is there a bug where this class is applied on form generation?

      <form role="form" class="form" method="get">
        <div class="row">
          <div class="col">
            {% bootstrap_field AwardFilter.form.award %}
            {% bootstrap_field AwardFilter.form.keywords %}
            <div class="form-check form-switch">
              {% if request.GET.winner == 'true' %}
                <input class="form-check-input" type="checkbox" name="winner" id="id_winner" value="true" checked>
              {% else %}
                <input class="form-check-input" type="checkbox" name="winner" id="id_winner" value="true">
              {% endif %}
              <label class="form-check-label" for="winner">Winners only</label>
            </div>
          </div>
        </div>
        <div class="row mt-2">
          {% buttons submit='Search' %}{% endbuttons %}
        </div>
      </form>

On initial page load, you will see the class is applied:

<form role="form" class="form" method="get">
        <div class="row">
          <div class="col">
            <div class="mb-3 is-valid"><label class="form-label" for="id_award">Award</label><select name="award" class="form-select is-valid" title="" id="id_award">
...
</select></div>
            <div class="mb-3 is-valid"><label class="form-label" for="id_keywords">Title, Author, or Keywords</label><input type="text" name="keywords" class="form-control is-valid" id="id_keywords"></div>
            <div class="form-check form-switch">
              
                <input class="form-check-input" type="checkbox" name="winner" id="id_winner" value="true">
              
              <label class="form-check-label" for="winner">Winners only</label>
            </div>
          </div>
        </div>
        <div class="row mt-2">
          <div class="mb-3"><button class="btn btn-primary" type="submit">Search</button></div>
        </div>
      </form>

Form rendering is not adapted to v5

There were several changes on how to render forms in Bootstrap 5 (see the migration guide) This library still renders forms in an v4 manner which looks rather ugly.

I'm gonna put up a PR to change the FORM_GROUP_CLASS to mb-3 as form-group was dropped.
But there are several other changes to consider like the removal of form-row/form-inline

horizontal layout does not work

I use this tag in my template for the form with two fields and they are showing in two rows instead of 2 columns:

{% bootstrap_form estimator_form layout="horizontal" %}

Excluding form fields results in field renderer outputting unsafe text

Example:

{% bootstrap_form form exclude="ignore_field" %}

field renderer returns empty (unsafe) string when encountering the ignored field. When concatenated with safe text, the resulting string becomes unsafe and renders escaped html string into template instead rendering the form.

Conflicts with Sphinx 4.4.0

Hi, I'm trying to install this library but my project already uses Sphinx 4.4.0 and it crashes

pip install django-bootstrap-v5

Collecting django-bootstrap-v5
  Downloading django_bootstrap_v5-1.0.8-py3-none-any.whl (24 kB)
Collecting importlib-metadata<4.0,>=3.10
  Downloading importlib_metadata-3.10.1-py3-none-any.whl (14 kB)

...

ERROR: pip's dependency resolver does not currently take into account all the packages that are installed. This behaviour is the source of the following dependency conflicts.
sphinx 4.4.0 requires importlib-metadata>=4.4; python_version < "3.10", but you have importlib-metadata 3.10.1 which is incompatible.

Because you don't want to drop importlib-metadata dependency, is it possible at least to upgrade your optional Sphinx dependency?

Similar to: #8

Unexpected TemplateSyntaxError

After loading the 'bootstrap5' in my template I rendered the csrf token, {%bootstrap_form form%} . when i run the server i am getting an Unexpected TemplateSyntaxError that is telling me that bootstrap_form expected an endblock. here is my template

`{% extends "base.html" %}
{% load bootstrap5 %}
{% block content %}
<div class="container">
  <h1>Log In</h1>
  <form method="POST" class="form">
      {% csrf_token %}
      {% bootstrap_form form %}
      {% buttons %}
          <button type="submit" class="btn btn-primary">login</button>
      {% endbuttons %}
  </form>
</div>
{% endblock content %}

And here is the error I am getting
TemplateSyntaxError at /account/login/ Invalid block tag on line 8: 'bootsrap_form', expected 'endblock'. Did you forget to register or load this tag?
Error details:

`
{% extends "base.html" %}
{% load bootstrap5 %}
{% block content %}
<div class="container">
<h1>Log In</h1>
<form method="POST">
{% csrf_token %}
{% bootsrap_form form%}
<input type="submit" class="btn btn-default" value="Login">
</form>
 
</div>
 
{% endblock content %}`

What noticed, i wrote bootstrap and the error has bootsrap in it omitting the 't' after 's' in the spelling of bootstrap, i made that error when i typed it in the first time and since then it has been returning the same error even though i have eited my template to correct the typo.
any help rendered would be highly appreciated

access a local version when the CDN is not available (or local dev)

Is there a way to override the settings file when the CDN is unavailable (ie during development) and to serve a local file instead?

zelenij / django-bootstrap-v5 Goto Github PK

django-bootstrap-v5's People

Stargazers

Watchers

Forkers

django-bootstrap-v5's Issues

Recommend Projects

Recommend Topics

Recommend Org