2017-07-18 91 views
0

取決於我使用的是什麼主題 - 我的日期選擇器不起作用,它正在使我無法正常工作。無法使DatePicker正常工作

我已經做了很多次,但得到了一個奇怪的反應:我可以讓它在沒有我的自定義引導主題的情況下工作,但是它不起作用。該頁面加載爲應該看起來如何,但日期選擇器不起作用,但如果我刪除我的主題它會。

我之所以這麼說很奇怪,是因爲我2天前在一個項目中使用了這個主題,並且它工作得很好,但現在它不適用於這個新項目。

@model WADTrackerApplication.Models.Weight 

@{ 
    ViewBag.Title = "Create"; 
} 
<html> 
<head> 

</head> 
<body> 
    <div class="container"> 

@using (Html.BeginForm()) 
{ 
    @Html.AntiForgeryToken() 

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

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

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

     <div class="form-group"> 
      <div class="col-md-offset-2 col-md-10"> 
       <input type="submit" value="Create" class="btn btn-default" /> 
      </div> 
     </div> 
    </div> 
} 
    </div> 

    <link href="~/Content/bootstrap-theme.css" rel="stylesheet" /> 
    <script src="~/Scripts/jquery-1.10.2.min.js"></script> 
    <script src="~/Scripts/moment.js"></script> 
    <script src="~/Scripts/bootstrap.min.js"></script> 
    <script src="~/Scripts/bootstrap-datetimepicker.min.js"></script> 
    <link href="~/Content/bootstrap-datetimepicker.min.css" rel="stylesheet" /> 
    <script src="~/Scripts/bootstrap-datetimepicker.js"></script> 
    <script type="text/javascript"> 
     $(function() { 
      $('DateTime').datetimepicker({ 
       viewMode: 'years', 
       format: 'DD/MM/YYYY' 
      }); 
     }); 

    </script> 
</body> 

</html> 




<div> 
    @Html.ActionLink("Back to List", "Index") 
</div> 

@section Scripts { 
    @Scripts.Render("~/bundles/jqueryval") 
} 
+1

$( '日期時間')。 datetimepicker({?你需要指定它是類還是id嗎? –

回答

1

JavaScript代碼有一個錯誤選擇$('DateTime')將選擇DateTime類型的所有元素,這並不在您的標記存在。

添加描述性類或ID到要充當日期選擇器輸入:

@Html.EditorFor(model => model.DateTime, new { htmlAttributes = new { @class = "form-control date-picker" } }) 

然後使用你的JS是選擇片段:

$(function() { 
    $('.date-picker').datetimepicker({ 
    viewMode: 'years', 
    format: 'DD/MM/YYYY' 
    }); 
}); 
+0

可惜這仍然不起作用 – user3042332

+0

http://imgur.com/a/cw8hM – user3042332

+0

即使當我輸入「.datepicker()」它也不會甚至不會嘗試自動完成它 – user3042332