proper size of combobox dropdown

[rjParticipant]

how to correctly calculate the width and height combobox-dropdown window, in order to avoid words-cutting (horizontally) and scrollbar as much as possible and to show items vertically as fit as possible (e.g: no blank space after last item).
thanks in advance

[HristoParticipant]

Hello rj,

Could use autoDropDownHeight: true that property will be useful to omit ‘scrollbar’.
About ‘width’ I would like to propose as in this example.

Best Regards,
Hristo Hristov

jQWidgets team
http://www.jqwidgets.com

[rjParticipant]

Hi Hristo,
Thank you so much, your proposed example is extremely helpful (especially the amazing ‘optimal’ function). Here is my modification based on your solution. So now, final width can be calculated on ‘open’ event, and the result is just what I wanted. At least this gonna be a solution protoype to be enhanced later. You see, I set the {autoDropDownHeight: false}, since I don’t want the scroll-bar to appear on document.body part.
Wow,,, one more thing to solve. Now, while the vertical scroll-bar stays intact, how to calculate the height of dropdown window to it’s maximum without exceeding bottom edge of viewport when the returned data item is quite many (say:300 items)?….

[rjParticipant]

Oops, there was a typo in the link, please try this

[HristoParticipant]

Hi rj,

Thanks for using our product.
This is issue that need own decision. Important things are position of ComboBox how much elements will show.
The height of document.

var docHeight = $(document).height();
console.log(docHeight);

This property is for height of dropdown dropDownHeight: '' + ( optimalHeight ) + 'px',

Best Regards,
Hristo Hristov

jQWidgets team
http://www.jqwidgets.com

[Author]

Posts