Question

我有一个asp.net mvc4应用程序。在视图上传中我想添加一个数据贴纸日历，所以我修改了这样的布局：

   <head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <meta charset="utf-8" />
        <title>@ViewBag.Title - Mon application ASP.NET MVC</title>
        <link href="~/akeo.ico" rel="shortcut icon" type="image/x-icon" />
        <link href="@Url.Content("~/Content/themes/base/jquery.ui.all.css")" rel="stylesheet" type="text/css" />
    <link href="../../Content/Site.css" rel="stylesheet" type="text/css" />
    <link href="../../Content/jquery.ui.all.css" rel="stylesheet" type="text/css" />

    <script src="../../Scripts/jquery-1.4.1.min.js" type="text/javascript"/>
    <script src="../../Scripts/jquery.ui.core.js" type="text/javascript" />
    <script src="../../Scripts/jquery.ui.widget.js" type="text/javascript" />
    <script src="../../Scripts/jquery.ui.datepicker.js" type="text/javascript" />

    <script src="/Scripts/MicrosoftAjax.js" type="text/javascript" />
    <script src="/Scripts/MicrosoftMvcAjax.js" type="text/javascript" />
    <script src="/Scripts/MicrosoftMvcValidation.js" type="text/javascript" /> 
          <script>
              $(function () {
                  $("#datepicker").click(datepicker());
              });
    </script>
        <meta name="viewport" content="width=device-width" />
        @Styles.Render("~/Content/css")
        @Scripts.Render("~/bundles/modernizr")
    </head>

在Uploading.cshtml视图中，我为数据选择器添加了一个文本区域：

@using (Html.BeginForm("Uploading", "Akeo", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
    <input type="file" name="file" />
    <br />
    @Html.Label("Date d'expiration")
    <input type="text" name="duree" />
    <br />


    <input type="text" id="datepicker" />
    <input type="submit" value="OK" />

}

files 问题是当我点击文本时没有发生任何事情并且日历没有出现。

这是什么原因？如何修改代码以更正此错误？

Answer 1

您的javascript代码应为：

$(function () {
      $("#datepicker").datepicker();
});

Answer 2

您正尝试通过ID datepicker访问输入字段。要么改变选择输入字段的方式，要么在输入字段上添加id，如下所示：

<input id="datepicker" type="text" name="duree" />

或者您可以将输入字段的类型更改为日期并选择它：

$('input[type="date"]')

并将js更改为：

$('input[type="date"]').datepicker()

我建议您查看HTML5输入类型。日期类型越来越受到支持：http://caniuse.com/input-datetime

如果您不关心所有这些，只需更改这两部分：

$(function() {
    $( "#myDate" ).datepicker();

}）;

<input type="text" id="myDate" />

在asp.net mvc4应用程序中包含数据贴纸

2 个答案: