2010-08-13 137 views
6

亲爱的我在窗体里面有一个日期选择器。 我点击文本框后,日期选择器显示为向上(反转,下拉)。 我该怎么办,如果我想显示日期选择器下拉不dropup? http://img413.imageshack.us/img413/1460/screenshot5g.png如何设置datepicker的显示位置?

+0

你忘了在你的问题中提到jQuery。没人会知道你在说什么日期选择器。我知道,因为我回答你的最后一个问题:) – vikmalhotra 2010-08-13 05:02:49

+0

@lznogood - 这个问题已经标记为因为我上次评论时可能错过了它们。 – vikmalhotra 2010-08-13 05:08:17

回答

0

在此post寻找解决方案。这是你在找什么?

+0

@Shivik:哪个更好的命令可以让我的日期选择器显示:向下 - 然后向右? – klox 2010-08-13 06:15:03

+0

@klox - 您使用的是哪个jquery datepicker?你使用的是jquery-ui datepicker(http://jqueryui.com/demos/datepicker)还是其他的? – vikmalhotra 2010-08-13 06:27:31

+0

@Shivik:当然是,并使用阳光主题。 – klox 2010-08-13 06:35:17

10
$('.datetime').datepicker({ 
    dateFormat: 'm/d/yy', 
    beforeShow: function (input, inst) { 
     var offset = $(input).offset(); 
     var height = $(input).height(); 
     window.setTimeout(function() { 
      inst.dpDiv.css({ top: (offset.top + height + 4) + 'px', left: offset.left + 'px' }) 
     }, 1); 
    } 

}); 
+0

对于那些想知道它背后的逻辑[检查此](http://api.jqueryui.com/datepicker/#option-beforeShow) – 2017-07-04 07:42:57

0

扩大伊戈尔的答案。要将日历放置在日期选择器输入元素的右下角,请使用:

$('.datepicker').datepicker({ 
    beforeShow: function (input, inst) { 
     var offset = $(input).offset(); 
     window.setTimeout(function() { 
      var calWidth = inst.dpDiv.width(); 
      var inpWidth = $(input).width() + parseInt($(input).css('padding')); 
      inst.dpDiv.css({ left: offset.left + (inpWidth - calWidth) + 'px' }) 
     }, 1); 
    } 
}); 
相关问题