C# MVC和jQuery日期选择器_C#_Asp.net Mvc_Jquery Ui_Asp.net Mvc 4_Jquery Ui Datepicker

C# MVC和jQuery日期选择器

c# asp.net-mvc jquery-ui asp.net-mvc-4

C# MVC和jQuery日期选择器,c#,asp.net-mvc,jquery-ui,asp.net-mvc-4,jquery-ui-datepicker,C#,Asp.net Mvc,Jquery Ui,Asp.net Mvc 4,Jquery Ui Datepicker,我试图将datepicker应用到属性为datepicker的文本框中所以我是这样做的： \u Layout.cshtml <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <title>@ViewBag.Title</title> <link href="~/favicon.ico" rel="shortcut

我试图将datepicker应用到属性为

datepicker

的文本框中

所以我是这样做的： \u Layout.cshtml

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>@ViewBag.Title</title>
    <link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />
    <meta name="viewport" content="width=device-width" />
    @Styles.Render("~/Content/css")
    @Scripts.Render("~/bundles/modernizr")
    <script src="@Url.Content("~/Scripts/jquery-2.0.2.js")" 
    type="text/javascript"></script>
    <link href="@Url.Content("~/Content/themes/base/jquery.ui.core.css")" 
    rel="stylesheet" type="text/css" />
    <link href="@Url.Content("~/Content/themes/base/jquery.ui.datepicker.css")" 
    rel="stylesheet"  type="text/css" />
    <link href="@Url.Content("~/Content/themes/base/jquery.ui.theme.css")" 
    rel="stylesheet" type="text/css" />
    <script src="@Url.Content("~/Scripts/jquery-ui-1.10.3.js")" 
    type="text/javascript"></script>

</head>
<body>
    <header>
        <div class="content-wrapper">
            <div class="float-right">
                <nav>
                    <ul id="menu">
                        <li>@Html.ActionLink("Home", "Index", "Home")</li>
                        </li>
                    </ul>
                </nav>
            </div>
        </div>
    </header>
    <div id="body">
        @RenderSection("featured", required: false)
        <section class="content-wrapper main-content clear-fix">
            @RenderBody()
        </section>
    </div>

    @Scripts.Render("~/bundles/jquery")
    @RenderSection("scripts", required: false)
</body>

@model Zaliczenie_SIG.Models.InvoiceModel
@{
    ViewBag.Title = "Add";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

添加

@使用（Html.BeginForm（））{
@Html.AntiForgeryToken（）
@Html.ValidationSummary（true）
发票联
@LabelFor（model=>model.InvoiceType）
@DropDownList（“InvoiceType”，string.Empty）
@Html.ValidationMessageFor（model=>model.InvoiceType）
@LabelFor（model=>model.TransactionDate）
@Html.TextBoxFor（model=>model.TransactionDate，新的{@class=“datepicker”}）
@Html.ValidationMessageFor（model=>model.TransactionDate）
@LabelFor（model=>model.PaymentDate）
@Html.TextBoxFor（model=>model.PaymentDate，新的{@class=“datepicker”}）
@Html.ValidationMessageFor（model=>model.PaymentDate）
@LabelFor（model=>model.ContractorId）
@DropDownList（“ContractorId”，string.Empty）
@Html.ValidationMessageFor（model=>model.ContractorId）


}
@ActionLink（“返回列表”、“索引”）
@节脚本{
@Scripts.Render（“~/bundles/jqueryval”）
jQuery（文档）.ready（函数（）{
$（“.datepicker”）.each（函数（）{$（this.datepicker（）；}）；
});
}

Model.cs

public int Id { get; set; }
    [DisplayName("type")]
    [Required(ErrorMessage = "required")]
    public int InvoiceType { get; set; }
    [DisplayName("Operation date")]
    [Required(ErrorMessage = "required", AllowEmptyStrings = false)]
    public DateTime TransactionDate { get; set; }
    [DisplayName("Paymant date")]
    public DateTime? PaymentDate { get; set; }
    public DateTime DateOfIssue { get; set; }
    [DisplayName("Pozycje Faktury")]
    public IEnumerable<InvoiceItemModel> InvoiceItems { get; set; }
    [Required(ErrorMessage = " required")]
    [DisplayName("Contractor")]
    public int ContractorId { get; set; }     

    public InvoiceModel(){}

public int Id{get；set；}
[显示名称（“类型”）]
[必需（ErrorMessage=“必需”）]
公共int发票类型{get；set；}
[显示名称（“操作日期”）]
[必需（ErrorMessage=“必需”，AllowEmptyStrings=false）]
公共日期时间事务日期{get；set；}
[显示名称（“付款日期”）]
公共约会时间？PaymentDate{get；set；}
公共日期时间问题的日期{get；set；}
[显示名称（“Pozycje Faktury”）]
公共IEnumerable InvoiceItems{get；set；}
[必需（ErrorMessage=“必需”）]
[显示名称（“承包商”）]
public int ContractorId{get；set；}
公共发票模型（）{}

但是有了这个，我得到了js错误，它说：uncaughtTypeError:Object[Object Object]没有方法“datepicker” 我做错了什么，需要改变以使其正常工作

对象[Object Object]没有方法“datepicker”我在做什么错误，需要更改以使其正常工作

您应该将jquery ui捆绑包包括到布局中：

@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/jqueryui")
@RenderSection("scripts", required: false)

datepicker扩展是的一部分

此外，由于您的脚本包含在DOM的末尾，因此不需要将它们包装在

$（文档）中。就绪回调：
@section Scripts {
  @Scripts.Render("~/bundles/jqueryval")
  <script type="text/javascript">
      $(".datepicker").datepicker();
  </script>
}

@节脚本{
@Scripts.Render（“~/bundles/jqueryval”）
$（“.datepicker”）.datepicker（）；
}
这并不能直接回答您的问题，因为Darin Dimitrov已经知道了，但我建议您的代码过于复杂
您可以将javascript简化为：
<script type="text/javascript">
    $(".datepicker").datepicker();
</script>


$（“.datepicker”）.datepicker（）；
您也可以指定日期格式。e、 g$（“.datepicker”）.datepicker（{dateFormat:“m/d/yy”，}）好的，但没有datepicker的背景。我错过了其他东西吗？是的，你错过了~/Content/themes/base/css
样式包。您可以将其添加到布局的
部分：@Styles.Render（“~/Content/themes/base/css”）
。或者，如果您想使用不同的主题，您可以在bundle中更改它。请先阅读jqueryui的文档，然后再使用它来熟悉基本要求和如何开始。是的，您有权利：）非常感谢@Darin
<script type="text/javascript">
    $(".datepicker").datepicker();
</script>