MVC5 Bootstrap Datetimepicker CSS formatiert nicht korrekt

Question

Ich arbeite gerade daran, meinem MVC5-Projekt einen datetimepicker hinzuzufügen. Ich habe mich entschieden, Bootstrap.v3.datetimepicker von Eonasdan zu verwenden. Nun, ich habe es in einem gewissen Umfang funktioniert, aber die Formatierung ist nicht korrekt. Der aktuelle Tag ist nicht ausgewählt, Monat/Jahr sind nicht zentral ausgerichtet und das Zeitsymbol ist auch nicht zentral ausgerichtet. Wenn Sie versuchen, den Monat/das Jahr zu ändern, werden die Monate/Jahre in einer Zeile angezeigt.

Es muss CSS verwendet sein, aber ich habe keine Ahnung, wie es zu lösen. Hat jemand das gleiche Problem gehabt und das gelöst?

bundleconfig.cs

 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*")); 

     bundles.Add(new ScriptBundle("~/bundles/datetime").Include(
      "~/Scripts/moment*", 
      "~/Scripts/bootstrap-datetimepicker*")); 

     //   // 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/site.css")); 

       bundles.Add(new ScriptBundle("~/bundles/jqueryui") 
     .Include("~/Scripts/jquery-ui-{version}.js")); 

       bundles.Add(new StyleBundle("~/Content/jqueryui") 
        .Include("~/Content/themes/base/all.css")); 

    } 

_Layout.cshtml

... 
@Scripts.Render("~/bundles/jquery") 
@Scripts.Render("~/bundles/jqueryui") 
@Scripts.Render("~/bundles/bootstrap") 
@Scripts.Render("~/bundles/datetime") 
@RenderSection("scripts", required: false) 
</body> 
</html> 

Create.cshtml - Kontrolle

 <div class="form-group"> 
     @Html.LabelFor(model => model.Check_Date, htmlAttributes: new { @class = "control-label col-md-2" }) 
     <div class="col-md-10"> 
      @Html.EditorFor(model => model.Check_Date, new { htmlAttributes = new { @class = "form-control" } }) 
      @Html.ValidationMessageFor(model => model.Check_Date, "", new { @class = "text-danger" }) 
     </div> 
    </div> 

Create.cshtml - Skripte

@section scripts { 
<script type="text/javascript"> 
    $(function() { 
    $('#Check_Date').datetimepicker({ 
    defaultDate: '@DateTime.Now', 
    locale: 'en', 
    widgetPositioning: { 
     vertical: 'bottom', 
     horizontal: 'left' 
    } 
}); 
}); 
</script> 
} 

Answer 1

Sie könnten bootstrap-datetimepicker.css verpasst haben.

auf den folgenden Link finden: Follow the GitHub Link- By Eonasdan