jQuery ui datepicker positioning problem when scrolling down webpage

Question

I have a webpage that uses multiple instances of the jQuery ui datepicker. My webpage will display ~80 records which extends beyond a single screenshot.

<         


        

Answer 1

The Datepicker-UI popup can be made draggable by adding the following code:

$('#ui-datepicker-div').draggable();

As this ID applies to the component div created for all popup datepickers on the page. While:

$(".ui-datepicker").draggable()

Applies to all datepickers on a page (whether popup or inline). By making the panel draggable, you can usually position the datepicker where you want it without scrolling.