DatePicker и другие всплывающие окна, скрытые за модальное всплывающее окно

У меня есть JQuery Popup модал, который я вызываю, как это

function showDialog(clickid,reportid) {
         var clickid=clickid;
         var reportid=reportid;
            reportFilterDialog= $("#reportFilterDialog").modal({
              autoOpen: false,
              draggable: true,
              resizable: true,
              height: 220,
              width: 420,
              zIndex: 1001,
              //modal: true,
              title: 'Populate Report Parameters'

   });

В этом модале у меня есть DatePicker, вызываемый при нажатии кнопки.. как это

       jQuery(function() {
               jQuery( "#from_date" ).datetimepicker({ dateFormat: 'yy-mm-dd',
                   showSecond: true,
                   timeFormat: 'hh:mm:ss',
                   changeMonth: true,
                   changeYear: true,
                   showOn: "button",
                   zIndex:9999,
                    buttonImage: "/gra/images/icons/fugue/calendar-month.png",
                   buttonImageOnly: true });
       });

где from_date - идентификатор поля ввода

Я все еще вижу, что указатель даты появляется за модальным всплывающим окном. Я установил z-индекс указателя даты выше, чем модальный, но он не работает. Я также установил .ui-datepicker z-index для 9999 в DatePicker css и jquery css, который имел свойство.
Также любое другое всплывающее окно, вызываемое из модального всплывающего окна, загружается за модальным. Как я могу решить эту проблему?

2 ответа

Могу поспорить, что это связано только со значением z-index. У меня была похожая проблема и следующее изменение в jquery ui css, и она работала для меня в модальном режиме (обратите внимание на z-index: 2000! Важный - важен был нужен, иначе z-index переопределялся):

.ui-datepicker { width: 17em; padding: .2em .2em 0; display: none; z-index: 2000 !important;}

Я тоже когда-то сталкивался с подобной проблемой. Установка z-index не сработала. Я пытался с приведенным ниже кодом.

$("#IDofTimePicker").timepicker({
        template: "modal",
        format: 'HH:mm'
    });

Установка шаблона как "модального" работала для меня. Надеюсь, это кому-нибудь поможет.

Другие вопросы по тегам