Opened 2 hours ago
#36723 new Bug
Help text appears below FilteredSelectMultiple's select controls
| Reported by: | Jacob Walls | Owned by: | |
|---|---|---|---|
| Component: | contrib.admin | Version: | 6.0 |
| Severity: | Normal | Keywords: | |
| Cc: | Triage Stage: | Unreviewed | |
| Has patch: | no | Needs documentation: | no |
| Needs tests: | no | Patch needs improvement: | no |
| Easy pickings: | no | UI/UX: | yes |
Description
There is code in SelectFilter2.js that appears to reposition a help text for a FilteredSelectMultiple above the controls, but it doesn't work for two reasons:
- it searches for a help text in a
<p>tag, but it became a<div>in #27207 - to find the wanted help text today, it now would need to start its search two parents higher (#34383 looks relevant, but I didn't verify if already an issue before that)
In other words, if we want this code to work, it would need to be like:
-
django/contrib/admin/static/admin/js/SelectFilter2.js
diff --git a/django/contrib/admin/static/admin/js/SelectFilter2.js b/django/contrib/admin/static/admin/js/SelectFilter2.js index 2100280220..beb50fb5e2 100644
a b Requires core.js and SelectBox.js. 18 18 from_box.setAttribute('aria-labelledby', field_id + '_from_label'); 19 19 from_box.setAttribute('aria-describedby', `${field_id}_helptext ${field_id}_choose_helptext`); 20 20 21 for (const p of from_box.parentNode.getElementsByTagName('p')) { 22 if (p.classList.contains("info")) { 23 // Remove <p class="info">, because it just gets in the way. 24 from_box.parentNode.removeChild(p); 25 } else if (p.classList.contains("help")) { 21 const parentOfFlexContainer = from_box.parentNode.parentElement.parentElement; 22 for (const div of parentOfFlexContainer.getElementsByTagName('div')) { 23 if (div.classList.contains("info")) { 24 // Remove <div class="info">, because it just gets in the way. 25 parentOfFlexContainer.removeChild(div); 26 } else if (div.classList.contains('help')) { 26 27 // Move help text up to the top so it isn't below the select 27 28 // boxes or wrapped off on the side to the right of the add 28 29 // button: 29 from_box.parentNode.insertBefore(p, from_box.parentNode.firstChild);30 parentOfFlexContainer.insertBefore(div, parentOfFlexContainer.firstChild); 30 31 } 31 32 }
To reproduce, just visit the admin, edit a user, view the permissions select widget, observe placement of the help text.
Attachments (2)
Note:
See TracTickets
for help on using tickets.

