Several breaking changes in jQuery UI 1.8rc1

Several breaking changes in jQuery UI 1.8rc1

I tried out my current project with jQuery UI 1.8 rc1 and found several breaking changes (that worked fine using 1.7.2). Some of these are probably acceptable and are just documentation issues (#1 and #3) as the api docs apparently haven't been updated to 1.8 yet, others seem to be bugs that should be fixed (#2 and #4). I figured I'd list them all to perhaps save someone else the pain of discovering these on his own.

  1. As mentioned in the change logs draggable stack option is now a selector instead of a hash. This a breaking change as old style hash code will cause an error when drag is attempted.
  2. The fact that draggable stack option is now a selector apparently introduced a bug. If no elements exist that match the selector, you get an error on drag (jquery-ui.js line 1341 group[0] is undefined). A simple check for an element at 0 would fix this bug. (my use case is that the dragged element gets assigned the class that matches this selector on drop, and subsequent drags of other elements would stay on top of previously dropped elements)
  3. As mentioned in the change logs, the ui argument passed in drop no longer has absolutePosition. It has been replaced by offset. This is a breaking change as old code using absolutePosition no longer works.
  4. Problem when calling functions on datePicker from within datepicker beforeShowDay event. The following sample code causes the prev and next month buttons to operate incorrectly (if picker opens in Jan, next will bring you to Feb, and then go no further, prev will then incorrectly bring you to Dec, and then it toggles back and forth between those two months)
    1. var today = new Date();
    2. today.setMilliseconds(0);
    3. today.setSeconds(0);
    4. today.setMinutes(0);
    5. today.setHours(0);
    6. beforeShowDay: function (date) {
    7.     var tooltip = '';
    8.     if (date.getTime() === today.getTime()) {
    9.         tooltip = 'today';
    10.     }
    11.     var theChosenOne = d.datepicker('getDate');
    12.     if (theChosenOne && theChosenOne.getTime() === date.getTime()) {
    13.         tooltip = 'selected date';
    14.     }
    15.     return [true, '', tooltip];
    16. }
Stephen