title: Bootstrap datepicker not working in MVC project
body: <p>I followed this guy's third solution:</p>
  
  <p><a href="https://blog.jigsawpieces.me/2014/07/23/lbd-adding-datetimepicker-control-to-mvc-project/" rel="nofollow noreferrer">https://blog.jigsawpieces.me/2014/07/23/lbd-adding-datetimepicker-control-to-mvc-project/</a></p>
  
  <p>pretty much it said to install via Nuget Package Manager in Visual Studio: </p>
  
  <pre><code>Install-Package Bootstrap.v3.Datetimepicker
  </code></pre>
  
  <p>then to add this to Bundle.config: </p>
  
  <pre><code>bundles.Add(new ScriptBundle("~/bundles/moment").Include(
                      "~/Scripts/moment.js"));
  </code></pre>
  
  <p>I see it display the calender icon next to the input field but when I click it the calendar does not drop down. Here is my Bundle.config file:</p>
  
  <pre><code>public static void RegisterBundles(BundleCollection bundles)
      {
          bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                      "~/Scripts/jquery-{version}.js",
                      "~/Scripts/jquery-ui*"));
  
          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/moment").Include(
                     "~/Scripts/moment.js"));
  
          bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include(
                    "~/Scripts/bootstrap.js",
                    "~/Scripts/respond.js"));
  
          bundles.Add(new StyleBundle("~/Content/css").Include(
                    "~/Content/bootstrap.css", 
                    "~/Content/themes/base/jquery.ui.all.css",
                    "~/Content/site.css"));
  
  
      }
  </code></pre>
  
  <p>Here is my view which displays this input field: </p>
  
  <pre><code>&lt;div class="row"&gt;
                              &lt;div class='col-sm-6'&gt;
                                  &lt;div class="form-group"&gt;
                                      &lt;div class='input-group date' id='datetimepicker1'&gt;
                                          &lt;input type='text' class="form-control datepicker" /&gt;
                                          &lt;span class="input-group-addon"&gt;
                                              &lt;span class="glyphicon glyphicon-calendar"&gt;&lt;/span&gt;
                                          &lt;/span&gt;
                                      &lt;/div&gt;
                                  &lt;/div&gt;
                              &lt;/div&gt;
                              &lt;script type="text/javascript"&gt;
                                      $(function () {
                                          $('#datetimepicker1').datetimepicker({ format: 'dd MM yyyy - hh:ii' });
                                      });
                              &lt;/script&gt;
                          &lt;/div&gt;
  </code></pre>
  
  <p>What am I doing wrong? Why won't the calendar drop down and display the datepicker?? </p>
  
  <p>Here is my new Bundle.config. I added the other js and css files and still nothing: </p>
  
  <pre><code>public static void RegisterBundles(BundleCollection bundles)
      {
          bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                      "~/Scripts/jquery-{version}.js",
                      "~/Scripts/jquery-ui*"));
  
          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/moment").Include(
                     "~/Scripts/moment.js"));
  
          bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include(
                    "~/Scripts/bootstrap.js",
                    "~/Scripts/bootstrap-datetimepicker.min.js",
                    "~/Scripts/respond.js"));
  
          bundles.Add(new StyleBundle("~/Content/css").Include(
                    "~/Content/bootstrap.css",
                    "~/Content/bootstrap-datetimepicker.min.css",
                    "~/Content/themes/base/jquery.ui.all.css",
                    "~/Content/site.css"));
  
  
      }
  </code></pre>