2013-10-12 116 views
0

我剛剛將我的項目從TB2更新爲TB3,我使用這個bootstrap-datetimepicker來選擇日期/時間。從Bootstrap 2升級到Bootstrap後佈局搞砸了3

正如您在該網站上看到的那樣,如果您在該網站的輸入字段中單擊,則會彈出日曆。這就是它在升級之前用於我工作的方式。現在,它看起來像這樣:

enter image description here

日曆默認情況下彈出,和日期的仍然是可點擊,但是當你完成點擊日期和時間的輸入字段不得到填補。即使是ValidationMessageError默認是可見的(但現在,忘記這一點)。

這是標誌了,我用:

<div class="input-group date" id="datetimepicker1" data-date-format="yyyy-mm-dd hh:ii"> 
    <input class="form-control" size="16" type="text" id="StartDate" name="StartDate" /> 
    <span class="input-group-addon"><i class="glyphicon glyphicon-remove"></i></span> 
    <span class="input-group-addon"><i class="glyphicon glyphicon-th"></i></span> 
</div> 

<br /> 

<div class="input-group date" id="datetimepicker2" data-date-format="yyyy-mm-dd hh:ii"> 
    <input class="form-control" size="16" type="text" id="EndDate" name="EndDate" /> 
    <span class="input-group-addon"><i class="glyphicon glyphicon-remove"></i></span> 
    <span class="input-group-addon"><i class="glyphicon glyphicon-th"></i></span> 
</div> 

這個標記是從標記上bootstrap-datetimepicker不同。我已經用TB3中的新課程替換了這些課程。我還更新了bootstrap-datetimepicker.js文件,可以看到here

這是我的頭標記:

<head> 
     <meta charset="utf-8" /> 
     <title>@ViewBag.Title - My ASP.NET MVC Application</title> 
     <meta name="viewport" content="width=device-width" /> 
     <meta http-equiv="X-UA-Compatible" content="IE=edge"> 

     @Scripts.Render("~/bundles/modernizr") 
     @Scripts.Render("~/bundles/jquery") 

     <link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet"> 
     <link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css" rel="stylesheet"> 
     <link href="@Url.Content("~/Content/site.css")" rel="stylesheet" type="text/css" /> 
     <link href="@Url.Content("~/Content/chosen.css")" rel="stylesheet" type="text/css" /> 
     <link href="@Url.Content("~/Content/datetimepicker.css")" rel="stylesheet" type="text/css" /> 

     <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script> 
     <script src="@Url.Content("~/Scripts/MicrosoftAjax.js")" type="text/javascript"></script> 
     <script src="@Url.Content("~/Scripts/MicrosoftMvcAjax.js")" type="text/javascript"></script> 
     <script src="@Url.Content("~/Scripts/chosen.jquery.min.js")" type="text/javascript"></script> 
     <script src="@Url.Content("~/Scripts/bootstrap-datetimepicker.js")" type="text/javascript"></script> 

     <script type="text/javascript" lang="javascript"> 
      $(document).ready(function() { 
       $(".chzn-select").chosen(); 
      }); 
     </script> 
    </head> 

其中一個計算器的職位使我this網站包括所有引導文件(CSS/JS/ghypicons)加入在頭這些鏈接。正如你所看到的,它說的鏈接「完整的」之上。我看不到包括什麼。這bootstrap-datetimepicker需要dropdowns.lesssprites.less它的工作。

如果任何人都可以幫我解決我亂七八糟的佈局,我真的很感激!

回答