无法添加到DatePicker的模态 - 在背景显示(Trouble Adding DatePick

我试图插入一个datepicker我发现这里： http://www.eyecon.ro/bootstrap-datepicker/但我不能让它在我的模态的面前展示。 （我可以看到它在模式的背景下）

我不知道如果我要么实现它不正确，或者如果我需要钻机它是在模态的显示器顶部。

这是我的Bundle.config，我添加了datepicker.css和bootstrap-datapicker.js文件。

public class BundleConfig
{
    // For more information on bundling, visit http://go.microsoft.com/fwlink/?LinkId=301862
    public static void RegisterBundles(BundleCollection bundles)
    {
        bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                    "~/Scripts/jquery-{version}.js"));

        bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
                    "~/Scripts/jquery.validate*"));

        // Use the development version of Modernizr to develop with and learn from. Then, when you're
        // ready for production, use the build tool at http://modernizr.com to pick only the tests you need.
        bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(
                    "~/Scripts/modernizr-*"));

        bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include(
                  "~/Scripts/bootstrap.js",
                  "~/Scripts/respond.js"));

        bundles.Add(new StyleBundle("~/Content/css").Include(
                  "~/Content/bootstrap.css",
                  "~/Content/datepicker.css",
                  "~/Content/site.css"));

        bundles.Add(new ScriptBundle("~/bundles/myscript").Include(
                  "~/Scripts/MyScripts.js", "~/Scripts/bootstrap-datepicker.js"));
    }
}

这里是我的模态

<div class="modal fade" id="createMovie" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
   <div class="modal-dialog">
      <div class="modal-content">
         <div class="modal-header" style="background-color: #428bca">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel" style="font-size: 30px; font-style:oblique; color:white">Create</h4>
         </div>
         <div class="modal-body">
            <table class="table" id="createTable">
               <tr>
                  <th class="col-lg-4">
                     <h5 style="font-size:x-large"><span style="font-weight:bolder">Title</span></h5>
                  </th>
                  <th class="col-lg-7 col-lg-offset-1">
                     <input type="text" name="createName" style="text-align: center; height: 35px; font-size: 20px; width: 100%" placeholder="Title" />
                  </th>
               </tr>
               <tr>
                  <th class="col-lg-4">
                     <h5 style="font-size:x-large"><span style="font-weight:bolder">Release Date</span></h5>
                  </th>
                  <th class="col-lg-7 col-lg-offset-1">
                     <input type="text" name="createRelease" id="datepicker" style="text-align:center; height:35px; font-size:20px; width:100%" placeholder="Date (mm/dd/yyyy)" />
                  </th>
               </tr>
               <tr>
                  <th class="col-lg-4">
                     <h5 style="font-size:x-large"><span style="font-weight:bolder">Description</span></h5>
                  </th>
                  <th class="col-lg-7 col-lg-offset-1">
                     <input type="text" name="createDescription" style="text-align:center; height:35px; font-size:20px; width:100%" placeholder="Description" />
                  </th>
               </tr>
            </table>
         </div>
         <div class="modal-footer">
            <button type="button" onclick="createFunction(this)" class="btn btn-success">Create</button>
            <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
         </div>
      </div>
   </div>
</div>

因此，“似乎”是工作的罚款，但因为它的大背景下出现的，我不能在日历中点击任何东西。

下面是参考图像

任何及所有帮助apprecaited！

我是新来了很多本，所以如果该解决方案是有点棘手的详细解释将受到欢迎！ :)

Answer 1:

这是一个CSS问题：

该模式的日期选择器是模态所以后面：

CSS：

.datepicker{
    z-index: 1100 !important;
}

如果日期选择控件是很好的.ui-日期选择器

文章来源: Trouble Adding DatePicker to Modal - Displays in backdrop