我正在使用ASP.Net网络表单,其中包括AJAX Modelpoup Extenderjquery nepali-datepicker。我必须将nepali-datepicker集成到第二个modelpopup内的文本框,即下图所示的蓝色背景。
我面临的问题是我无法将datepicker放置在textbox的底部

根据帖子(How to change the pop-up position of the jQuery DatePicker control)上的答案,我能够将datepicker带到第二个模型弹出窗口的前面。有没有一种方法可以用来将datepicker实际定位到文本框。

这是我的脚本和样式:

<script type="text/javascript">
    function pageLoad() {
        $('.nepali-calendar').nepaliDatePicker();
    }

    $(document).ready(function () {
        $('.nepali-calendar').nepaliDatePicker();

    });
</script>

<style type="text/css">
    div#ndp-nepali-box
    {
        position:absolute;
        z-index: 999999;
    }
</style>

下图显示了它现在的位置。

如果我使用position作为relative
<style type="text/css">
    div#ndp-nepali-box
    {
        position: relative;
        z-index: 999999;
    }
</style>

看起来像
c# - 在模式弹出文本框中更改Datepicker的位置-LMLPHP

有没有一种方法可以用来将datepicker实际定位到文本框的底部。

最佳答案

当您使用jquery UI Datepicker时,它应该具有beforeShow属性,并在该属性内更改css,如下所示。

检查此fiddle

$('input.date').datepicker({
beforeShow: function(input, inst) {
 var cal = inst.dpDiv;
 var top  = $(this).offset().top + $(this).outerHeight();
 var left = $(this).offset().left;
 setTimeout(function() {
    cal.css({
        'top' : top,
        'left': left
    });
 }, 10);
}
});

Reference

关于c# - 在模式弹出文本框中更改Datepicker的位置,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/31165299/

10-16 09:59