Skip to content

[BUG] Unable to make the Date(Time)PickerInput() widget use the current locale #112

@swiss-knight

Description

@swiss-knight

Hello,

I'm using a DatePickerInput() widget in a form in order to let a user select a date using this nice calendar widget within a django 4.2 application.

The locale is set as follow in the settings.py file:

LANGUAGE_CODE = "fr-FR"
TIME_ZONE = "Europe/Paris"
USE_I18N = True
USE_L10N = True
USE_TZ = True

The form is as follow:

from django import forms
from .app.model import MyModel
from bootstrap_datepicker_plus.widgets import DatePickerInput

class MyForm(forms.ModelForm):
   # stuff
    class Meta:
        model = MyModel
        fields = [
            "user_id",
            "created_at",
            "some_other_field",
        ]

        widgets = {
            "user_id": forms.NumberInput(),
            "created_at": DatePickerInput(),
            "some_other_field": forms.NumberInput(),
        }

And the corresponding app model is:

from django.db import models
from django.utils import timezone

class MyModel(models.Model):
    user_id = models.ForeignKey(
        User,
        null=True,
        on_delete=models.SET_NULL,
        verbose_name=_("User identifier"),
    )
    created_at = models.DateField(
        default=timezone.now,
        verbose_name=_("Date of creation"),
    )
    some_other_field = models.IntegerField(
        verbose_name=_("Some other field"),
    )

The widget looks as follow when it's set to the 9th of January 2024:
image

But it should be 09.01.2024 because the browser language is set to French. And when I watch at what is stored in the db, it's written 2024-09-01 (1st September 2024).

So I have to hard code that in the widget options in MyForm() class:

    DatePickerInput(
        options={
            "format": "DD.MM.YYYY",
            "locale": "fr-FR",
            "useCurrent": False,
        }
    ),

(There is no fancy templating:

{% load i18n %}
{% load bootstrap4 %}

{% block content %}
  <form method="POST">
    {% csrf_token %}
    {{ form.media }}
    {% bootstrap_form form layout='horizontal' %}

    <div>submission buttons</div>
  </form>
{% endblock %}

and nothing special in the views
)

Then it works within a French browser environment.

But now, when browsing the app using an English browser, the widget stays as it is coded (this is normal I guess):
image

and the user can no more submit the form because of a server error:

form.errors: <ul class="errorlist"><li>created_at<ul class="errorlist"><li>Enter a valid date.</li></ul></li></ul>

Expected behavior
So I would like to know if it's possible to make the DatePickerInput() widget be aware of the locale?
(Same goes for the DateTimePickerInput() widget).

If yes, how precisely?

For the moment, I'm thinking it's a bug or a missing feature.

Thanks a lot!

Setup Information (please complete the following information):

  • OS: Ubuntu 22.04.3 LTS
  • Browser Firefox 64bits
  • Browser version 121.0
  • Python version 3.10.6
  • Django version 4.2.8
  • Bootstrap version 4
  • jQuery version 1.13.2

[x] I have followed the configuration instructions and checked out the
common error troubleshooting page.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions