Django: Ticket #17218: Select Filter (its "to" box) has 0 height if in a collapsed fieldsethttps://code.djangoproject.com/ticket/17218
<p>
The select filter creates a pair of "from" and "to" widgets (in SelectFilter2.js), and gives them matching height by applying the height of the "from" box to the "to" box.
</p>
<p>
But if a model uses collapsed fieldsets in admin pages, the "from" box has 0 height (says jQuery) which effectively hides the "to" box. The widget data is intact, but obviously this is confusing and makes removing individual values impossible in the UI.
</p>
<p>
This happens in both Firefox/Mac and IE8/Win (discovered while editing Entries in the Zinnia blog app).
</p>
en-usDjangohttps://www.djangoproject.com/s/img/site/hdr_logo.gifhttps://code.djangoproject.com/ticket/17218
Trac 1.2jimallman <jim@…>Sun, 13 Nov 2011 19:47:05 GMTattachment sethttps://code.djangoproject.com/ticket/17218
https://code.djangoproject.com/ticket/17218
<ul>
<li><strong>attachment</strong>
set to <em>collapsed-fieldset-hides-to-box.png</em>
</li>
</ul>
<p>
When you expand the fieldset, the widget is missing (height=0)
</p>
Ticketjimallman <jim@…>Sun, 13 Nov 2011 19:51:04 GMTowner, status changedhttps://code.djangoproject.com/ticket/17218#comment:1
https://code.djangoproject.com/ticket/17218#comment:1
<ul>
<li><strong>owner</strong>
changed from <em>nobody</em> to <em>anonymous</em>
</li>
<li><strong>status</strong>
changed from <em>new</em> to <em>assigned</em>
</li>
</ul>
<p>
I'm going to attempt a fix, either by postponing the matching height (perhaps with an event listener) <em>or</em> by using a more sensitive test for <code>$(from_box).outerHeight()</code>
</p>
Ticketjimallman <jim@…>Sun, 13 Nov 2011 19:51:22 GMTstatus, owner changedhttps://code.djangoproject.com/ticket/17218#comment:2
https://code.djangoproject.com/ticket/17218#comment:2
<ul>
<li><strong>status</strong>
changed from <em>assigned</em> to <em>new</em>
</li>
<li><strong>owner</strong>
changed from <em>anonymous</em> to <em>jimallman</em>
</li>
</ul>
TicketJulien PhalipSun, 13 Nov 2011 21:59:13 GMTseverity, stage changedhttps://code.djangoproject.com/ticket/17218#comment:3
https://code.djangoproject.com/ticket/17218#comment:3
<ul>
<li><strong>severity</strong>
changed from <em>Normal</em> to <em>Release blocker</em>
</li>
<li><strong>stage</strong>
changed from <em>Unreviewed</em> to <em>Accepted</em>
</li>
</ul>
<p>
Thanks for the report. This is a regression that needs to get fixed before the next release.
</p>
Ticketjimallman <jim@…>Mon, 14 Nov 2011 20:49:30 GMThas_patch, needs_tests changedhttps://code.djangoproject.com/ticket/17218#comment:4
https://code.djangoproject.com/ticket/17218#comment:4
<ul>
<li><strong>has_patch</strong>
set
</li>
<li><strong>needs_tests</strong>
set
</li>
</ul>
<p>
OK, I've submitted a pull request to django/django on Github:
</p>
<blockquote>
<p>
<a class="ext-link" href="https://github.com/django/django/pull/83"><span class="icon">​</span>https://github.com/django/django/pull/83</a>
</p>
</blockquote>
<p>
I've run the modified <code>collapse.js</code> through the Closure Compiler, as requested. I don't have automated tests for this, sorry.
</p>
<p>
<strong>To see this pull request as a patch</strong>:
</p>
<blockquote>
<p>
<a class="ext-link" href="https://github.com/django/django/pull/83.diff"><span class="icon">​</span>https://github.com/django/django/pull/83.diff</a>
</p>
</blockquote>
<p>
Note that toggling a collapsible fieldset will now fire new custom jQuery events (<code>show.fieldset</code> and <code>hide.fieldset</code>) to all its child elements. This should come in handy for other widgets that need to adjust their placement or dimensions. See the changes to <code>SelectFilter2.js</code> for an example of binding widgets to respond to these events.
</p>
TicketJulien PhalipMon, 14 Nov 2011 23:17:35 GMThttps://code.djangoproject.com/ticket/17218#comment:5
https://code.djangoproject.com/ticket/17218#comment:5
<p>
I'm not sure that triggering the event with everything inside the fieldset is necessary. Why not trigger it just on the fieldset itself. The select filter can then simply subscribe to its parent fieldset's event being triggered.
</p>
<p>
As for the tests, I'm hoping to wrap up the work on <a class="closed ticket" href="https://code.djangoproject.com/ticket/2879" title="#2879: New feature: Add live test server support to test framework (closed: fixed)">#2879</a> so that some tests could be added for things like this.
</p>
<p>
Thanks for working on this!
</p>
Ticketjimallman <jim@…>Tue, 15 Nov 2011 02:05:46 GMThttps://code.djangoproject.com/ticket/17218#comment:6
https://code.djangoproject.com/ticket/17218#comment:6
<p>
As suggested, the <code>show.fieldset</code> and <code>hide.fieldset</code> events are now only triggered on the fieldset element itself. Each "subscriber" adds a handler to the fieldset to do its thing. (These events also bubble up the DOM, so the body or other elements on the page can respond.)
</p>
<p>
In this version, each select filter resizes just once, then unbinds its handler for fieldset events. You can get the latest version as a patch using the same URL as before:
</p>
<blockquote>
<p>
<a class="ext-link" href="https://github.com/django/django/pull/83.diff"><span class="icon">​</span>https://github.com/django/django/pull/83.diff</a>
</p>
</blockquote>
<p>
...which I realize could become really confusing later. I'm going to attach this version here as a traditional patch, as well.
</p>
<p>
As before, I've tested this in Safari/Mac, FF/Mac, IE8/Win, and IE7 (via compatibility mode).
</p>
Ticketjimallman <jim@…>Tue, 15 Nov 2011 02:07:49 GMTattachment sethttps://code.djangoproject.com/ticket/17218
https://code.djangoproject.com/ticket/17218
<ul>
<li><strong>attachment</strong>
set to <em>select-filter-waits-for-collapsed-fieldset.diff</em>
</li>
</ul>
<p>
Simple event trigger on fieldset, resizes each select filter just once.
</p>
TicketAdrian HolovatyFri, 09 Dec 2011 21:41:20 GMTstatus changed; resolution sethttps://code.djangoproject.com/ticket/17218#comment:7
https://code.djangoproject.com/ticket/17218#comment:7
<ul>
<li><strong>status</strong>
changed from <em>new</em> to <em>closed</em>
</li>
<li><strong>resolution</strong>
set to <em>fixed</em>
</li>
</ul>
<p>
In <a class="changeset" href="https://code.djangoproject.com/changeset/17181/">[17181]</a>:
</p>
<div class="message"><p>
Fixed <a class="closed ticket" href="https://code.djangoproject.com/ticket/17218" title="#17218: Bug: Select Filter (its &#34;to&#34; box) has 0 height if in a collapsed fieldset (closed: fixed)">#17218</a> -- Fixed bug with SelectFilter where the 'to' box had a height=0 when it was within a collapsed fieldset. Thanks jimallman<br />
</p>
</div>
TicketAdrian HolovatyFri, 09 Dec 2011 21:45:50 GMThttps://code.djangoproject.com/ticket/17218#comment:8
https://code.djangoproject.com/ticket/17218#comment:8
<p>
Thanks for the patch, jimallman. I made a few changes before committing:
</p>
<ul><li>I used jQuery chaining so that we wouldn't have to look up <code>$(this).closest("fieldset")</code> twice.
</li><li>I made a <code>resize_filters()</code> function so that we wouldn't have to define duplicate logic for the height normalization.
</li><li>I used jQuery's <code>one()</code> method, which does the work of <code>unbind()</code>.
</li></ul>
Ticket