Lock scrollBar at bottom

Hi people,

I have a container with some selects and when I change one of these selects, my application sends a AJAX request with all data and response is HTML code to replace container content.

After replacing HTML, I use select2 to create selects with images but when I want to scroll, I notice that scroll is lock at bottom of the page. Why is this happening?

I don’t understand what you mean by “scroll is locked at the bottom of the page”. Do you mean that the entire web page is scrolled to the end of the page, and you cannot scroll back to the top of the page?

Also, I don’t understand what you mean by “create selects with images”. What happens if you just stop after replacing the HTML (in other words, if you don’t create the selects with images)? Does the same scroll locked behavior happen? If it does, then the issue is not related to the Select2 widget.

Can you put your code on jsfiddle.net or codepen.io so I can see what’s happening?

Sorry, but now I can not provide a sample of my code.

And yes, my entire web page is scrolled to the end of the page and when I tried to scroll back to the back, the web page forced the scroll to the end of the page.

If I try without images, it happens the same problem.

I suspect the issue comes from how you’re inserting or replacing the HTML in the page, rather than the Select2 widget (which doesn’t affect the web page’s scroll position at all). However, without seeing your code and how it behaves, I cannot troubleshoot the problem any further.