只有月份和年份的ASP .NET MVC4 Datepicker

Question

我正在嘗試使datepicker只顯示年份和月份。

我在不同的地方看到了這個問題，但是我測試過的所有解決方案都不起作用。

我按照這個例子：http://jsfiddle.net/bopperben/DBpJe/

這裏是我的.cshtml文件：

@using Site.Models 
@{ 
    ViewBag.Title = "Rapports"; 
} 

<script type="text/javascript"> 
    $(function() { 
    $('.date-picker').datepicker({ 
    changeMonth: true, 
    changeYear: true, 
    showButtonPanel: true, 
    dateFormat: 'MM yy', 
    onClose: function(dateText, inst) { 
     var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val(); 
     var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val(); 
     $(this).datepicker('setDate', new Date(year, month, 1)); 
    } 
    }); 
    }); 
</script> 
<style type="text/css"> 
    .ui-datepicker-calendar { 
    display: none; 
    } 
</style> 

<h2>Rapports</h2> 

<div> 

    @using (Html.BeginForm()) { 
     <input name="startDate" id="startDate" class="date-picker" /> 
     <input type="submit" value="Rechercher" /> 
    } 

</div> 

但在我的頁面只有一個文本框，並沒有彈出，當我點擊它。 我不知道我在做什麼錯。

Answer 1

您是從ASP.NET MVC4互聯網模板開始的嗎？

我已經試過你的代碼，並得到它在兩個細節上工作。

我添加腳本標記的部分腳本（這將確保它呈現jQuery是加載之後）

@section scripts 
{ 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      $('.date-picker').datepicker({ 
       changeMonth: true, 
       changeYear: true, 
       showButtonPanel: true, 
       dateFormat: 'MM yy', 
       onClose: function(dateText, inst) { 
        var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val(); 
        var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val(); 
        $(this).datepicker('setDate', new Date(year, month, 1)); 
       } 
      }); 
     }); 
    </script> 
} 

在_Layout.cshtml我已經添加了jquerui包（腳本和樣式）（加載頁面jQueryUI的）

//In head tag 
@Styles.Render("~/Content/css") 
@Styles.Render("~/Content/themes/base/css") 

//After closing footer tag 

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

@RenderSection("scripts", required: false)