Global filter width when selecting element

By default, UX dynamically resizes the filter dropdown selection box based on the initial element selected. For example, if I have an element with a shorter name selected, the dropdown is not as wide as when I have an element with a longer name (see below):

image

image

In situations where the element name is long (e.g., code + description), it would be advantageous to have a wider dropdown box (regardless of which item was initially selected). Otherwise, it requires quite a bit of horizontal back-and-forth scrolling to see the names.

I was attempting to override the minimum-width using CSS and had limited success. Using the CSS below, I could make the filters wider globally (by inserting to custom-style.css) but couldn’t find a way to only apply the min-width to a specific filter on a specific page.

The closest I could get is creating a dummy widget to store the CSS (so it only applies to that page) but even then, it would apply to all filters on the toolbar. Has anyone discovered a way to either (a) apply min-width to a specific subnm filter or (b) make the entire dropdown box expandable (by dragging the corner)? Thanks!

.dropdown-menu.tm1-subnm-hierarchy-style {
    min-width: 500px !important;
}

image

3 Likes

Bringing this topic back, to see if there’s any solution to the filter widths…
In my case, wanted to adjust the Columns Filter width…

Is there any way to make it adjust automatically or potentially expand by dragging the filter box, so you can read the full text line?

image

Thanks!

1 Like

Hi @rmazziero
The advanced column filters are a built in feature of handsontable. So without changing the handsontable code I’m not sure if this is easily customizable. But it’s a reasonable RFE for sure to include a horizontal scrollbar and/or make the window resizeable.
Please make an RFE on Bitbucket.

1 Like

Hi @cw-ch-scott ,

Oh ok, thanks for the reply!
Sure, will create the ticket then!

Thanks!

1 Like