#34789: Admin filter_horizontal shows item in "Chosen" column after being added
through a Foreign Key field of the same model.
-----------------------------------------+------------------------
               Reporter:  devin13cox     |          Owner:  nobody
                   Type:  Bug            |         Status:  new
              Component:  contrib.admin  |        Version:  4.2
               Severity:  Normal         |       Keywords:
           Triage Stage:  Unreviewed     |      Has patch:  0
    Needs documentation:  0              |    Needs tests:  0
Patch needs improvement:  0              |  Easy pickings:  1
                  UI/UX:  1              |
-----------------------------------------+------------------------
 Hi there, I noticed a minor frontend bug related to the filter_horizontal
 tables in the admin console. Here is what I have:

 There is a model called Transition with two fields, source and target:

 {{{
 source = models.ManyToManyField(State, related_name="transition_source")
 target = models.ForeignKey(State, related_name="transition_target",
 on_delete=models.CASCADE)
 }}}

 For the admin console, we set filter_horizontal to include 'source'. Here
 is an example of a given state of a Transition, with "test" selected as
 Source and "test2" selected as Target.

 
[[Image(file:///Users/devincox/Desktop/Screenshot%202023-08-21%20at%202.09.51%20PM.png)]]

 Now, if I add a new State by clicking the "+" Icon next to the Target
 field (let's call it test3), it will add it to both the Target AND the
 "Chosen Source":

 
[[Image(file:///Users/devincox/Desktop/Screenshot%202023-08-21%20at%202.14.24%20PM.png)]]

 I will note that upon saving the Transition, it will not actually save
 "test3" to the Chosen Source, meaning that this is an issue only from a UI
 perspective. After any refresh or save, it will also no longer show in the
 Chosen Source column. Additionally, there is no issue going the other
 direction (if I add directly using the "+" next to Chosen Source, it will
 not appear to set the "Target" field as well, and it will save properly).
 Finally, if I were to select another available source (ex. "test2") and
 add it to the Chosen Source, it will successfully add "test2" and remove
 "test3" without needing a save or refresh.

 I believe this is due to the admin conveniently updating all related
 fields to include the added object, and therefore displaying it as if it
 was selected temporarily until refreshed

 Diving into this, I believe the issue is in this file:
 django/django/admin/static/admin/js/admin/RelatedObjectLookups.js

 In this function: UpdateRelatedSelectOptions, on this query:
 {{{
 const selectsRelated = document.querySelectorAll(`[data-model-
 ref="${modelName}"] select:not(.admin-autocomplete)`);
 }}}

 My initial guess is that updating the query to not include the "Chosen"
 column in filter_horizontal fields would solve this issue (something like
 {{{
 const selectsRelated = document.querySelectorAll(`[data-model-
 ref="${modelName}"] div:not(.selector-chosen) > select:not(.admin-
 autocomplete)`);
 }}}

 Let me know if more context is needed to help reproduce what is going on
 here. Thanks!

-- 
Ticket URL: <https://code.djangoproject.com/ticket/34789>
Django <https://code.djangoproject.com/>
The Web framework for perfectionists with deadlines.

-- 
You received this message because you are subscribed to the Google Groups 
"Django updates" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to [email protected].
To view this discussion on the web visit 
https://groups.google.com/d/msgid/django-updates/0107018a1a0f0a7f-03f4c45e-35f6-4bd5-94dd-6d58427c3944-000000%40eu-central-1.amazonses.com.

Reply via email to