title: Bootstrap DateTimePicker not showing calendar when clicked
body: <p>recently I tried to use <code>Bootstrap DateTimePicker</code> in my <code>ASP.NET MVC</code> project, and the calendar just wont show up. I believe I already put the Scripts and CSS in the right order.</p>
  
  <p>Here is my CSS and Scripts : </p>
  
  <pre><code> &lt;link href="~/Content/css/bootstrap.min.css" rel="stylesheet" /&gt;
   &lt;link href="~/Content/bootstrap-datetimepicker.min.css" rel="stylesheet" /&gt;
  
  &lt;script src="~/Scripts/jquery-3.4.1.min.js" type="text/javascript"&gt;&lt;/script&gt;
  &lt;script src="~/Scripts/moment.min.js" type="text/javascript"&gt;&lt;/script&gt;
  &lt;script src="~/Scripts/bootstrap.min.js" type="text/javascript"&gt;&lt;/script&gt;
  &lt;script src="~/Scripts/bootstrap-datetimepicker.min.js" type="text/javascript"&gt;&lt;/script&gt;
  @RenderSection("Scripts", required: false)
  </code></pre>
  
  <p>And this is my View Page : </p>
  
  <pre><code>&lt;div class="col-md-3"&gt;
     &lt;div class="form-group"&gt;
         &lt;label&gt;Tanggal Survey &lt;/label&gt;                          
            &lt;div class='input-group date' id='datetimepicker1'&gt;
                 &lt;input type='text' class="form-control" /&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;
  
  @section Scripts{
      &lt;script type="text/javascript"&gt;
          $(function () {
              $('#datetimepicker1').datetimepicker({
                  format: 'DD MMMM YYYY'
              });
          });
  
      &lt;/script&gt;
  }
  </code></pre>
  
  <p>And when I click the input, <strong>it just show the date and never show the pop-up calendar</strong>, 
  <a href="https://i.stack.imgur.com/gaUeT.png" rel="nofollow noreferrer">here is the example</a></p>