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)