opened 10:52AM - 26 Feb 18 UTC
closed 10:02AM - 20 Mar 19 UTC
status: stale
Hello,
I've discovered an issue with select2 when a multiple field is placed …near the bottom of a scrollable area. The example also uses AJAX and `minimumInputLength`. The bug occurs when the field is near the bottom of the viewport (when the search message appears at the top). The search copy and minimum input copy appear high up and not flushed to the field. This happens mostly on subsequent selections. One click in the field will display fine and the next won't. The JS Bin example is here: https://output.jsbin.com/cujamiv/ (scroll to the bottom)
Also important to note the positioning gets corrected on `scroll`.
I've done a temporary hack fix for my own app (didn't work without the `setTimeOut`):
// Hack fix jumpy search
{
var triggerScroll = () => {
var timer = setTimeout(() => {
jQuery('html, body').trigger('scroll');
}, 1);
}
jQuery('#budgetAdmins').on('select2:open', e => {
triggerScroll();
});
jQuery('.budget-field').on('keyup', '.select2-search__field', e => {
triggerScroll();
});
}