How to set the width of suggest boxes in RedQueryBuilder

50 views Asked by At

After you have chosen a field name, then you start typing in the value textbox, the dropdown defaults to a width of 150px which causes lots of things to be cut off. A scrollbar shows up so you can scroll left and right, but I would like to figure out how to set the minimum width of this element.

The css path to the element defining this is:

body > div.gwt-SuggestBoxPopup > div > table > tbody > tr.suggestPopupMiddle > td.suggestPopupMiddleCenter > div > div

It seems to be an inline style in the element

<div class="" style="overflow: auto; position: relative; zoom: 1; height: 322px; width: 150px;">

The field dropdown seems to re-size dynamically, so it does not get scroll bars, the suggest box starts at 150px and resizes sometimes, but it doesn't seem to have any rhyme or reason.

I added the following to my stylesheet:

.suggestPopupMiddleCenter > div > div { min-width: 300px; !important }

But that also affects the field dropdown, which appears to be working properly.

Is this a bug, or is there a configuration that I can use that will allow the value suggestion box dropdown to dynamically resize based on the widest element?

1

There are 1 answers

3
salk31 On

It is hard wired in the tardis branch https://github.com/salk31/RedQueryBuilder/blob/tardis/redquerybuilder-core/src/main/java/com/redspr/redquerybuilder/core/client/expression/SuggestEditorWidget.java#L107

It probably could use some rule to choose the width. Best if you raise a bug and make a suggestion?