只有月份和年份的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)