更换月和年不工作在引导模式窗口

In my project i am using jquery datepicker.It works well in all pages but it's not working in bootstrap modal window.Below is my code for loading datepicker.

在我的项目中，我使用jquery datepicker。它在所有页面上都很好用，但在引导模式窗口中不起作用。下面是我加载datepicker的代码。

  $("#StartDate").datepicker({
                                changeMonth : true,
                                changeYear : true,
                                dateFormat : "yy-mm-dd",
                            });

Now, I cannot able to change month and year from datepicker dropdown. How to fix this issue?Any help will be greatly appreciated!!!

现在，我不能从datepicker下拉改变月和年。如何解决这个问题?如有任何帮助，我们将不胜感激!!

5 个解决方案

#1

While searching more on it, I found it is already answered in another * post. Here is some working code, taken from there:

在搜索更多信息时，我发现它已经在另一个*帖子中回复了。下面是一些工作代码:

var enforceModalFocusFn = $.fn.modal.Constructor.prototype.enforceFocus;
$.fn.modal.Constructor.prototype.enforceFocus = function() {};

#2

Try this.

试试这个。

Why aren't you using bootstrap datepicker?

为什么不使用bootstrap datepicker?

<div class="container">
    <div class="row">
        <div class='col-sm-6'>
            <div class="form-group">
                <div class='input-group date' id='datetimepicker1'>
                    <input type='text' class="form-control" />
                    <span class="input-group-addon">
                        <span class="glyphicon glyphicon-calendar"></span>
                    </span>
                </div>
            </div>
        </div>
        <script type="text/javascript">
            $(function () {
                $('#datetimepicker1').datetimepicker();
            });
        </script>
    </div>
</div>

#3

If the modal already exists, then you can try event delegation as mentioned in this answer.

如果模态已经存在，那么您可以尝试本答案中提到的事件委托。

$(function() {
   $("body").delegate("#StartDate", "focusin", function(){
      $(this).datepicker();
   });
});

One more thing you can try is increasing the z-index of the StartDate text box

您还可以尝试增加StartDate文本框的z索引

#StartDate {
    z-index: 100000;
}

#4

It should definitely work. I made a fiddle with jquery ui datepicker in the modal window. check it out: https://jsfiddle.net/kr20nu8n/2/

它应该工作。我在模态窗口中摆弄了jquery ui datepicker。检查一下:https://jsfiddle.net/kr20nu8n/2/

html:

<button id="openModalButton">open modal</button>
<div id="myModal" class="modal">
    <div class="modal-dialog">
        <div class="modal-content">
            <input placeholder="click for datepicker" type="text" id="datepicker">
        </div>
    </div>
</div>

JS:

$("#datepicker").datepicker({
    changeMonth: true,
    changeYear: true,
    dateFormat: "yy-mm-dd",
});

$("#openModalButton").click(function () {
    $('#myModal').modal();
});

Maybe if you could post your full code, we could find the error that causes this.

如果你能发布完整的代码，我们就能找到导致这个的错误。

#5

<input class="form-control" type="text" data-provide="datepicker" data-date-format="yyyy/mm/dd" data-date-autoClose="true"/>

Try this. It works fine in Chrome.By the way,I'm using the bootstarp datepicker!

试试这个。它在Chrome上运行良好。顺便说一下，我正在使用bootstarp数据表程序!

#1