Opened 9 years ago
Closed 9 years ago
#15820 closed defect (invalid)
FilteringSelect: dropdown is always displayed at the bottom of select
Reported by: | zuzusik | Owned by: | Douglas Hays |
---|---|---|---|
Priority: | undecided | Milestone: | tbd |
Component: | Dijit - Form | Version: | 1.7.3 |
Keywords: | Cc: | ||
Blocked By: | Blocking: |
Description
dijit.FilteringSelect? uses dijit.popup.open method to show its dropdown
dijit.popup.open uses next code to do it:
var best = around ? place.around(wrapper, around, orient, ltr, widget.orient ? lang.hitch(widget, "orient") : null) : place.at(wrapper, args, orient == 'R' ? ['TR','BR','TL','BL'] : ['TL','BL','TR','BR'], args.padding); wrapper.style.display = ""; wrapper.style.visibility = "visible"; widget.domNode.style.visibility = "visible"; // counteract effects from _HasDropDown
This code then goes to dijit._place which uses dojo.marginBox to calculate if dropdown should be placed above or under the select input to fit the screen.
BUT! the wrapper has a style display set to 'none', so dojo.marginBox return it's height and width 0. This causes dijit._place to select not the really best position but the first of positions (which has aroundCorner set to "BL" and corner set to "TL")
So this can cause issues like on this screenshot when filtering select with long list is placed at the bottom of the page it's dropdown breaks the layout becaus of being placed under the select (look at attached file)
Attachments (1)
Change History (4)
Changed 9 years ago by
Attachment: | screen_dijit_filtering_select.jpg added |
---|
comment:1 Changed 9 years ago by
comment:2 Changed 9 years ago by
I've investigated a little bit more and realized that this is my fault, not dojo's...
Dojo sets display to "" to wrapper and visibility to "hidden" and moves it outside the viewport.
In my case dojo.marginBox returned w: 0 and h:0 because my custom theme used
.dijitMenu { position: absolute; top: -1px !important; }
to position list of options.
I've changed it to
.dijitMenu { margin: -1px 0; }
as it is done in 'claro' theme and now everything works fine.
Sorry again.
This can be closed now.
comment:3 Changed 9 years ago by
Resolution: | → invalid |
---|---|
Status: | new → closed |
Summary: | dijit.FilteringSelect dropdown is always displayed at the bottom of select → FilteringSelect: dropdown is always displayed at the bottom of select |
Sorry, ofcourse, I mean dijit.form.FilteringSelect?