Bootstrap Datepicker始终会在asp.net文本框的顶部弹出

Question

美好的一天程序员

我有这个asp.net文本框，我已经附加了Bootstrap Datepicker。 datepicker可以正常工作，因为即使指示它在文本框下弹出，它也会在文本框顶部弹出。请参阅下面的图片。我拉了我所有的头发，突然变得秃顶。

我还添加了我的标记。预先感谢。

jQuery脚本：

function pageLoad() {
       $("#<% =txtDate.ClientID%>").datepicker({
       //$('.input-group').datepicker({
       //$('#txtDate').datepicker({
           autoclose: true,
           todayHighlight: true,
           format: "mm/dd/yyyy",
           todayBtn: "linked",
           orientation: "bottom auto"
       });
   };

HTML标记：

<div class="col-md-8">
            <div  runat="server" ID="hid1" visible="false">
            <h4> Add Absences</h4>
            <div class="form-group">
                <asp:Label ID="Label1" CssClass="col-md-2 control-label" runat="server" Text="Absence Date"></asp:Label>
                <div class="col-md-5 input-group date">
                    <asp:TextBox ID="txtDate" CssClass="form-control" runat="server"></asp:TextBox> 
                    <%--<span class="input-group-addon">--%>
                                <span class="input-group-addon glyphicon glyphicon-calendar"></span>
                           <%-- </span>--%>

                </div>

                &nbsp &nbsp &nbsp;
                <asp:Button ID="btnAdd" runat="server" Text="Add" CssClass="btn btn-success" />
            </div> </div>

结果：

您还将注意到弹出菜单位于导航菜单下。

。