Bootstrap模式弹出中的Jquery datepicker无法按预期工作答案

【问题标题】：Jquery datepicker in Bootstrap modal pop up not working as expectedBootstrap模式弹出中的Jquery datepicker无法按预期工作
【发布时间】：2017-08-02 05:59:08
【问题描述】：

我在引导程序modal popup中使用jquery datepicker。打开弹出窗口后，我们可以选择日期并单击“保存”按钮。 popup 关闭并重新加载页面并将数据保存在数据库中。它按预期工作到这里。

但是，在以下情况下，它没有按预期工作。

我打开 popup 并关闭 popup 而不点击 'Save' 按钮
当我再次打开弹出窗口并输入日期并单击 'Save' 时，它会引发 jquery 未定义错误。

以下是我的代码：

    <div class="modal-body">
        <div class="form-group">
        <label for="<%=txtDate.ClientID %>">Date:</label>
        <asp:TextBox runat="server"  ReadOnly="true" ID="txtDate"  CssClass="form-control datepicker"></asp:TextBox>
    </div><hr/>
<asp:Button ID="btnSave" runat="server" CssClass="btn btn-warning" Text="Save" OnClick="btnSave_Click" UseSubmitBehavior="false" data-dismiss="modal" />
<button type="button" class="btn pull-right" data-dismiss="modal">Close</button></div>

我的 JS 代码：

<script src="<%=ConfigurationManager.AppSettings["Rootfolder"] %>/Scripts/jquery-ui-1.11.2.js"></script>

   <script type="text/javascript">

       var txt1 = '#<%= txtDate.ClientID%>';
       $today = new Date();
       $yesterday = new Date($today);
       $yesterday.setDate($today.getDate() - 0);

       $(function () {
           $(".datepicker").datepicker({

               dateFormat: "dd/mm/yy",
               minDate: $yesterday,
               autoclose : true
           });

       });

    </script>

我错过了什么吗？请让我知道是否需要添加一些东西，因为我尝试了太长时间并且没有按预期工作。

【问题讨论】：

未定义错误的编号是多少？应该有一个数字。
尝试使用 id 而不是 class。 ('#txtDate').datepicker({})
@Fotis Grigorakis 它每次的行为都不同。有时它会抛出错误，有时它只是不回发页面以保存数据。我只是试图给你错误号，但它没有回发页面保存，即使在控制台中也不会抛出任何错误。
@Rahul 我刚刚尝试使用 id 但它没有回发页面并且没有保存数据。弹出窗口刚刚关闭，之后没有任何反应。即使在控制台中也没有错误。
为什么它被否决了？提问的方式有什么问题吗？

标签： javascript jquery twitter-bootstrap datepicker popup

【解决方案1】：

我尝试通过重新加载 jQuery 来修复它，但它不起作用。因此，不是仅在单击“关闭”按钮时关闭模式弹出窗口，而是关闭模式弹出窗口，然后重新加载页面。为此，我将按钮更改为服务器端控件，并在单击事件时重定向到同一页面。这解决了问题。

我发布这个是因为如果有人遇到类似问题，这可能会成功。可能不是完美的解决方案，但它对我有用。

【讨论】：

【解决方案2】：

这对我有用。

在关闭引导模式时，只需使用 set defaults 方法将 datetimepicker 设置为默认值。

$(".modal").on("hidden.bs.modal", function () {
    $(selector).datetimepicker({}).setDefaults();
});

希望这会有所帮助。

【讨论】：

@user8403440 刷新文档不适合解决这些情况。