带有 Bootstrap 模式对话框的 Bootstrap DatePicker答案

【问题标题】：Bootstrap DatePicker with Bootstrap Modal Dialog带有 Bootstrap 模式对话框的 Bootstrap DatePicker
【发布时间】：2014-03-19 20:36:05
【问题描述】：

我正在尝试在 Bootstrap 模式对话框 (Bootstrap 3.0) 中使用 Bootstrap Datepicker。使用 Chrome 浏览器时，日期选择器根本不显示，但只有在插入如下代码所示的确认或警告语句时，才能在 Internet Explorer 中正确显示。

   var GetDate = function () {
        BootstrapDialog.show({
            title: "Go To Date",
            message: '<div><input id="StartDate" type="text" /></div',
            draggable: true,
            closable: false,
            cssClass: 'login-dialog',
            buttons: [{
                label: "Return Date",
                action: function (dialogRef) {
                    alert($("#StartDate").val().toLocaleString());
                    dialogRef.close();
                }
            }]
        });

        // The code only works on IE9, IE10 and IE11 with the following line
        confirm();

        var dp = $("#StartDate");
        dp.datepicker({
            format: "dd/mm/yyyy",
            todayBtn: "linked",
            autoclose: true,
            todayHighlight: true,
            language: "en"
        });
    }

    <input id="Button1" type="button" value="button" onclick="GetDate();" />

谁能告诉我为什么会这样以及如何解决这个问题？

【问题讨论】：

标签： twitter-bootstrap twitter-bootstrap-3 modal-dialog bootstrap-modal bootstrap-datepicker

【解决方案1】：

这行 CSS 应该对你有所帮助：

.datepicker.dropdown-menu { height:245px; width:210px; **z-index: 2000 !important; text-      indent:0px !important;**}

希望对你也有帮助...

【讨论】：