[Django] #32125: Added basic support for <datalist> elements for suggestions in Input widgets
Django
widgets
-------------------------------------+-------------------------------------
Reporter: Volodymyr | Owner: nobody
Type: New | Status: new
feature |
Component: Forms | Version: master
Severity: Normal | Keywords: datalist, forms,
Triage Stage: | html5
Unreviewed | Has patch: 0
Needs documentation: 0 | Needs tests: 0
Patch needs improvement: 0 | Easy pickings: 0
UI/UX: 1 |
-------------------------------------+-------------------------------------
HTML5 introduces a support for {{{<datalist>}}} '''HTML5''' elements for
suggestions in '''input''' tag
To do this in Django currently, you have to do something like:
'''django/forms/widgets/datalist.html'''
{{{
{% include "django/forms/widgets/input.html" %}
<datalist id="{{ widget.id }}" name="{{ widget.name }}"{% include
"django/forms/widgets/attrs.html" %}>{% for group_name, group_choices,
group_index in widget.optgroups %}{% if group_name %}
<optgroup label="{{ group_name }}">{% endif %}{% for option in
group_choices %}
{% include option.template_name with widget=option %}{% endfor %}{% if
group_name %}
</optgroup>{% endif %}{% endfor %}
</datalist>
}}}
'''django/forms/widgets/datalist_option.html'''
{{{
<option value="{{ widget.value|stringformat:'s' }}"{% include
"django/forms/widgets/attrs.html" %}>
}}}
'''django/forms/widgets.py'''
{{{#!python
class Datalist(Select):
input_type = 'text'
template_name = 'django/forms/widgets/datalist.html'
option_template_name = 'django/forms/widgets/datalist_option.html'
add_id_index = False
checked_attribute = {'selected': True}
option_inherits_attrs = False
}}}
'''django/forms/fields.py'''
{{{#!python
class DatalistField(ChoiceField):
widget = Datalist
default_error_messages = {
'invalid_choice': _('Select a valid choice. %(value)s is not one
of the available choices.'),
}
def __init__(self, *, choices='', **kwargs):
super().__init__(**kwargs)
self.choices = choices
}}}
--
Ticket URL: <https://code.djangoproject.com/ticket/32125>
Django <https://code.djangoproject.com/>
The Web framework for perfectionists with deadlines.
Django
widgets
-------------------------------------+-------------------------------------
Reporter: Volodymyr | Owner: nobody
Component: Forms | Version: master
Severity: Normal | Resolution:
Keywords: datalist, forms, | Triage Stage:
html5 | Unreviewed
Has patch: 0 | Needs documentation: 0
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 0 | UI/UX: 1
-------------------------------------+-------------------------------------
Old description:
New description:
HTML5 introduces a support for {{{<datalist>}}} '''HTML5''' elements for
suggestions in '''input''' tag
To do this in Django currently, you have to do something like:
'''django/forms/widgets/datalist.html'''
{{{
{% include "django/forms/widgets/input.html" %}
<datalist id="{{ widget.id }}"{% include "django/forms/widgets/attrs.html"
--
--
Ticket URL: <https://code.djangoproject.com/ticket/32125#comment:1>
Django
widgets
-------------------------------------+-------------------------------------
Reporter: Volodymyr | Owner: nobody
Component: Forms | Version: master
Severity: Normal | Resolution: wontfix
Keywords: datalist, forms, | Triage Stage:
html5 | Unreviewed
Has patch: 0 | Needs documentation: 0
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 0 | UI/UX: 1
-------------------------------------+-------------------------------------
* status: new => closed
* resolution: => wontfix
Comment:
There was some discussion when adding autocomplete to the admin as to
whether to include a datalist widget. (ref #14370 and
[https://groups.google.com/g/django-
developers/c/jGgZngTq3Gw/m/VEFcxUEJAwAJ mailing list discussion].) Perhaps
support is better now but, conclusion was more or less that browser
support wasn't really good enough to use there.
I'm going to close as wontfix for now. The custom widget is exactly the
right way to go.
For an addition like this, I would suggest wrapping it into a small third-
party library so that people can try it out and then approaching the
DevelopersMailingList to see if there's an appetite to bring such into
core. Thanks.
--
Ticket URL: <https://code.djangoproject.com/ticket/32125#comment:2>
Django
widgets
-------------------------------------+-------------------------------------
Reporter: Volodymyr | Owner: nobody
Severity: Normal | Resolution: wontfix
Keywords: datalist, forms, | Triage Stage:
html5 | Unreviewed
Has patch: 0 | Needs documentation: 0
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 0 | UI/UX: 1
-------------------------------------+-------------------------------------
Comment (by Michael):
Replying to [comment:2 Carlton Gibson]:
> There was some discussion when adding autocomplete to the admin as to
whether to include a datalist widget. (ref #14370 and
[https://groups.google.com/g/django-
developers/c/jGgZngTq3Gw/m/VEFcxUEJAwAJ mailing list discussion].) Perhaps
support is better now but, conclusion was more or less that browser
support wasn't really good enough to use there.
>
> I'm going to close as wontfix for now. The custom widget is exactly the
right way to go.
>
> For an addition like this, I would suggest wrapping it into a small
third-party library so that people can try it out and then approaching the
DevelopersMailingList to see if there's an appetite to bring such into
core. Thanks.
Support for it is looking pretty good now: https://caniuse.com/datalist
I think this is going to become more and more necessary. This along with
JavaScript modules really makes Django show its age.
--
Ticket URL: <https://code.djangoproject.com/ticket/32125#comment:3>
Django
widgets
-------------------------------------+-------------------------------------
Reporter: Volodymyr | Owner: nobody
Component: Forms | Version: dev
Severity: Normal | Resolution: wontfix
html5 | Unreviewed
Has patch: 0 | Needs documentation: 0
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 0 | UI/UX: 1
-------------------------------------+-------------------------------------
Comment (by christophertubbs):
This recently popped up as a need in one of our products. Having the extra
option on the `TextInput` widget or something and copying some of the
select widget logic would probably make things pretty simple. Something
like:
**django/forms/templates/django/forms/widgets/text.html:**
{{{
{% include "django/forms/widgets/input.html" %}
{% if widget.datalist %}
<datalist id="{{ widget.name }}__datalist">
{% for group_name, group_choices, group_index in widget.datalist %}
{% if group_name %}
<optgroup label="{{ group_name }}">
{% endif %}
{% for option in group_choices %}
{% include option.template_name with widget=option %}
{% endfor %}
{% if group_name %}
</optgroup>
{% endif %}
{% endfor %}
</datalist>
{% endif %}
}}}
It's nothing too terribly fancy. You'd need to make sure that the widget
has {{{ {"list": name + "__datalist"} }}} is in the attributes to make
sure that that datalist has the right name for the linkage.
You can always go fancier or more robust with it, but something fairly
simple that can be tacked onto the standard text widget would be awesome.
--
Ticket URL: <https://code.djangoproject.com/ticket/32125#comment:4>