Timepicker displays behind container when hosted in some non-jQuery UI dialog containers

[mark-larter]

Behavior happens because the current internal _getZIndex function traverses the parent element tree, but returns when the first non-zero zindex value is found, returning a value which may not be the largest zindex among the parents. One condition where it causes the problem is with certain non-jQuery UI dialog containers that use large fixed zindex values and nested zindex-influenced elements of their own.

Admittedly, this may not be a use case that warrants any attention, but just in case, here is a modified version of the _getZIndex function that resolves this issue:

// This is an enhanced copy of the zIndex function of UI core 1.8.?? For backward compatibility.
// Enhancement returns maximum zindex value discovered while traversing parent elements, 
// rather than the first zindex value found. Ensures the timepicker popup will be in front,
// even in funky scenarios like non-jq dialog containers with large fixed zindex values and
// nested zindex-influenced elements of their own.
_getZIndex: function (target) {
    var elem = $(target);
    var maxValue = 0;
    var position, value;
    while (elem.length && elem[0] !== document) {
        position = elem.css("position");
        if (position === "absolute" || position === "relative" || position === "fixed") {
            value = parseInt(elem.css("zIndex"), 10);
            if (!isNaN(value) && value !== 0) {
                if (value > maxValue) { maxValue = value; }
            }
        }
        elem = elem.parent();
    }

    return maxValue;
},

[fgelinas]

Hi Mark,
You are right, the current code did not work correctly with embedded z-index.
Tried the new code here ( http://jsfiddle.net/DRdsE/1/ ) and it works fine.
Commiting the change. Thanks for sharing this fix!