Question

我在LF 6.2中发现了portlet中日期字段的一个问题。

问题是，在点击输入字段后，日期选择器正在显示，但是zIndex = 0，这意味着它位于portlet下。

如果我将firebug上的参数更改为1，一切正常。

我曾尝试将zIndex添加到YUI代码中，但尚未成功。如何更改DatePicker的zIndex？

我的代码如下：

 <i id="icon" class="icon-calendar icon-1x"></i>
<input id="date" type="text" />

<aui:script>

YUI().use('aui-datepicker', function (Y) {

    var datePicker = new Y.DatePicker({
        trigger: '#date',
        zIndex: 100
    });

    Y.one('#icon').on('click', function(event) {
        // Cannot do datePicker.show(); because of https://issues.liferay.com/browse/AUI-1795
        var date = document.getElementById('date');
        date.focus();
        date.click();
    });
});


</aui:script>

以上代码生成以下html：

    <div id="yui_patched_v3_11_0_2_1434399332971_43" class="datepicker-popover yui3-widget popover yui3-widget-positioned yui3-widget-modal yui3-widget-stacked bottom" style="left: 79px; top: 419px; display: block; z-index: 0;">

Answer 1

您需要更改zIndex内部DatePicker上的Popover：

new Y.DatePicker({
    // ...   
    popover: {
        zIndex: 1
    }
});

有关详细信息，请参阅example page和API docs。

如何在Liferay Portlet 6.2中更改aui-datepicker的zIndex属性

1 个答案: