datepicker appears grayed out and behind modal dialog

[Jack Bakker, geändert vor 6 Jahren.]

I have a modal dialog with a form which needs a datepicker

onclick of the input field in the form in the modal successfully produces the datepicker, but the calendar appears grayed out and behind the dialog

ideas ?

<aui:script>
    AUI().use('aui-datepicker',function(A) {
        var preferredDatePicker;
        input = A.one('#<portlet:namespace />preferredDate');

        preferredDatePicker = new A.DatePicker({
            trigger: '#<portlet:namespace />preferredDate',
            mask : '%d/%b/%y',
            popover: {
                zIndex: 999
            },
            calendar: {
                setValue : true,
                //minDate : new Date(),
                //maxDate : '09/05/2100',
                selectMultipleDates : false,
                on: {
                    dateClick: function(event) {
                        input.set('value', A.Date.format(event.date,{ format:preferredDatePicker.get('mask') }) );
                    }
                }
            },
        });
    });
</aui:script>

[Jack Bakker, geändert vor 6 Jahren.]

a solution is simply to increase the z-index:

.datepicker-popover {
    z-index: 99999 !important;
}

[Jack Bakker, geändert vor 6 Jahren.]

Jack Bakker:

a solution is simply to increase the z-index:

.datepicker-popover {
    z-index: 99999 !important;
}

oh, I see now, the z-index of datepicker is set in js with

popover: {
                zIndex: 99999
            },