https://v5.getbootstrap.com/

https://github.com/twbs/bootstrap/projects

Better to start early then to wait till the last minute.

Probably need to rename this package when fully upgraded or make another branch.

These reflect the newest versions shown on the Bootstrap website.

I suspect folks would prefer to be on newer versions of these libraries. However, I can see how you might prefer to have users take these updates via settings updates instead.

Updated links were all sourced from here. The cdnjs website provides the SHA values using the 512 algorithm (instead of 384) which is maybe better?

Instead of the URLs coming from different CDNs they now all use Cloudflare (which never goes down, right? 😛).

TESTING:

• I tried the template tags out with these changes and didn't notice any errors in the inspector.

{% bootstrap_field field show_label=False %}

currently still renders the label, but with class="sr-only". This is great for most cases, but it is actually a bad idea if the users manually adds the label separately. In that case, both labels will be associated with the form field and the computed aria-label will be "{label} {label}".

I tried to change the used bootstrap4 version. So I added to following dict to the settings.py:

BOOTSTRAP4 = { # The Bootstrap base URL 'base_url': '//maxcdn.bootstrapcdn.com/bootstrap/4.1.3/', }

But the tag {% bootstrap_css %} still includes version 4.0.0:

<link crossorigin="anonymous" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" rel="stylesheet">

I'd like to show field errors at the field, instead of at the top of the form. (In horizontal mode, if it matters).

I've looked at the source for FormRendered a bit but it doesn't seem there's a way to do this, is there?

I'm thinking of removing the template tags for inclusion of JS and CSS. When using local source/dist a dev should know what to include, may use webpack or another tool to combine static files, et cetera. So the only viable use case for including through tags would be CDN. This would burden us with keeping up with Bootstrap releases to adjust CDN URL's and signatures.

Any input on this matter?

I tried to create a simple form with 2 radio buttons and the buttons are rendered side by side horizontally. Would have expected that the radio buttons would be vertically stacked by default (as this is the bootstrap 4 default according to docs, see url below).

view/form:

from django.views.generic import FormView

class TestForm(forms.Form):
    OPTIONS = (('1', 'Yes'), ('0', 'No'))
    
    options = forms.ChoiceField(
        label="Simple form",
        choices=OPTIONS,
        widget=forms.RadioSelect)

class Index(FormView):
    template_name = 'index.html'
    form_class = TestForm

template index.html:

{% load bootstrap4 %}

{# Load CSS and JavaScript #}
{% bootstrap_css %}
{% bootstrap_javascript jquery='full' %}

{# Display django.contrib.messages as Bootstrap alerts #}
{% bootstrap_messages %}

{# Display a form #}
<form action="/url/to/submit/" method="post" class="form">
  {% csrf_token %}
  {% bootstrap_form form %}
  {% buttons %}
    <button type="submit" class="btn btn-primary">
      Submit
    </button>
  {% endbuttons %}
</form>

result:

Simple form
( ) Yes  ( ) No
[Submit]

expected result:

Simple form
( ) Yes 
( ) No
[Submit]

The form part of the generated HTML looks something like this:

<form action="/url/to/submit/" method="post" class="form">
  <div class="form-group">
    <label for="id_options_0">Simple form</label>
    <div class="radio radio-success" id="id_options">
      <label for="id_options_0">
        <input type="radio" name="options" value="1" class="" title="" required="" id="id_options_0"> Yes
      </label>
      <label for="id_options_1">
        <input type="radio" name="options" value="0" class="" title="" required="" id="id_options_1"> No
      </label>
    </div>
  </div>
  <div class="form-group">
    <button type="submit" class="btn btn-primary">
      Submit
    </button>
  </div>
</form>

Looking at the bootstrap 4 documentation it looks like each radio button should be placed inside a div with the class form-check to get the default stacked layout.

Furthermore i cannot find any references to the classes radio and radio-success in bootstrap 4, these 2 are added in post_widget_render for RadioSelect.

After browsing through the django-bootstrap4 code quickly i found def radio_list_to_class(self, html, klass) which maps <li> and </li> to empty string. If the radio buttons really are supposed to be inside a div with class form-check then we should probably change the mapping to look like this

mapping = [
            ("<ul", '<div class="{klass}"'.format(klass=classes)),
            ("</ul>", "</div>"),
            ("<li>", '<div class="form-check">'),
            ("</li>", "</div>"),
        ]

Trying this locally at least I get the default stacked layout that I expected, but I'm not sure if this will break some other layout. Or am I missing some other parameter here which can solve the initial problem?

PS C:\Users\user\Downloads\django-bootstrap4-master\django-bootstrap4-master\demo> python manage.py runserver Unhandled exception in thread started by <function check_errors.<locals>.wrapper at 0x060BFE88> Traceback (most recent call last): File "C:\Users\user\AppData\Local\Programs\Python\Python36-32\lib\site-packages\django\utils\autoreload.py", line 225, in wrapper fn(*args, **kwargs) File "C:\Users\user\AppData\Local\Programs\Python\Python36-32\lib\site-packages\django\core\management\commands\runserver.py", line 112, in inner_run autoreload.raise_last_exception() File "C:\Users\user\AppData\Local\Programs\Python\Python36-32\lib\site-packages\django\utils\autoreload.py", line 248, in raise_last_exception raise _exception[1] File "C:\Users\user\AppData\Local\Programs\Python\Python36-32\lib\site-packages\django\core\management\__init__.py", line 327, in execute autoreload.check_errors(django.setup)() File "C:\Users\user\AppData\Local\Programs\Python\Python36-32\lib\site-packages\django\utils\autoreload.py", line 225, in wrapper fn(*args, **kwargs) File "C:\Users\user\AppData\Local\Programs\Python\Python36-32\lib\site-packages\django\__init__.py", line 24, in setup apps.populate(settings.INSTALLED_APPS) File "C:\Users\user\AppData\Local\Programs\Python\Python36-32\lib\site-packages\django\apps\registry.py", line 89, in populate app_config = AppConfig.create(entry) File "C:\Users\user\AppData\Local\Programs\Python\Python36-32\lib\site-packages\django\apps\config.py", line 90, in create module = import_module(entry) File "C:\Users\user\AppData\Local\Programs\Python\Python36-32\lib\importlib\__init__.py", line 126, in import_module return _bootstrap._gcd_import(name[level:], package, level) File "<frozen importlib._bootstrap>", line 994, in _gcd_import File "<frozen importlib._bootstrap>", line 971, in _find_and_load File "<frozen importlib._bootstrap>", line 953, in _find_and_load_unlocked ModuleNotFoundError: No module named 'tests'

Hello if render fields separatelly from the main form, field errors under the fields after false valdation arent shown. If render form as a whole - everything is fine.

html:

                    <div class = "offset-1 col-4" >
                        {% bootstrap_field form1.last_year layout='inline' size="small" form_group_class="" label_class="form-label col-md-3"  %}
                        <small class="form-text text-muted">{{ form1.last_year.help_text }}</small>
                    </div>

Should i use special div classes to swith it on maybe? Fields are marked in green and red according True/false validation -thats fine, but no error texts are shown under the field. Main errors panel above the whole form displays them

Thank you

I have an html form that consists of multiple model forms. Not all of the forms need to be filled out by the user. Thus i would like to make it so that the forms that are not required only cause errors to be displayed if they are filled out partially in an invalid way.

To give a more concrete example: I have a form for creating a new customer object in the database. This object represents a company. It may have a contact person associated with it.

For the data of the customer object itself i use a django ModelForm like this:

class NewCustomerForm(ModelForm):
    class Meta:
        model = Customer
        fields = [
            'customer_id',
            'name',
            'discount_special',
            'provision',
            'reseller',
            'tax_id_number',
            ]

notice that there are no fields for the contact person there, because for that i have another ModelForm:

class ContactForm(ModelForm):
    class Meta:
        model = Contact
        fields = [
            'name',
            'email',
            'phone',
            ]

I do not need information about the contact person to create a customer object, but in the template i use to render these I treat them as one big html-<form>-tag so all the information gets submitted with at the same time. It works fine if every field is filled out with valid data. If the fields of the contact person are fully empty, I would like to just create the customer object. For that i need the client-side validation to allow submitting the whole html-form even though the part for the contact person is empty. Currently it seems like i need to write some custom JS to achieve that.

I would really like if there was a parameter like this to specify that the form as a whole may be empty (or invalid):

{% bootstrap_form contact required=False %}

Is there a parameter that works like this?

P.S.: This issue aside i think that django-bootstrap4 works pretty well for me, so GOOD JOB!

EDIT: Make the wording more precise

Hi,

Currently checkboxes are still rendered in the Bootstrap 3 way: the checkbox input is rendered within the checkbox label. Because of changes in the way checkboxes are handled in Bootstrap 4, checkboxes rendered like this, don't work in Bootstrap 4 compatible themes.

This pull request changes the rendering to the Bootstrap 4 way.

Bumps tox from 3.27.1 to 4.2.1.