我正在使用ASP.Net网络表单,其中包括AJAX Modelpoup Extender
和jquery 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>
看起来像
有没有一种方法可以用来将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/