Jquery datepicker向MVC4模型提交值

时间:2014-01-15 10:42:15

标签: jquery asp.net-mvc-4 jquery-ui-datepicker datapicker

我有以下代码,它曾经是日期注册字段中的一个datepicker弹出窗口。并希望将日期值提交到数据库中的注册字段。简而言之,我的意思是说我想从jquery datepicker中选择一个日期,而不是手动给它。但不幸的是从来没有工作......当我点击注册字段时,我想要一个jquery datapicker弹出窗口....

我的学生.cs

namespace ContosoSite.Models
{
    using System;
    using System.Collections.Generic;
    using System.ComponentModel.DataAnnotations;
    [MetadataType(typeof(StudentMetadata))]
    public partial class Student
    {
        public Student()
        {
            this.Enrollments = new HashSet<Enrollment>();
        }

        public int StudentID { get; set; }
        public string LastName { get; set; }
        public string FirstName { get; set; }
        [Display(Name = "EnrollmentDate")]
        [DataType(DataType.Date)]
        [DisplayFormat(DataFormatString = "{0:yyyy-MM-dd}", ApplyFormatInEditMode = true)]
        public Nullable<System.DateTime> EnrollmentDate { get; set; }
        public string MiddleName { get; set; }
        public virtual ICollection<Enrollment> Enrollments { get; set; }
    }
}

create.cshtml

@model ContosoSite.Models.Student
@{
    ViewBag.Title = "Create";
}

<h2>Create</h2>

<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
  <link rel="stylesheet" href="/resources/demos/style.css"> 
@using (Html.BeginForm())
{
    @Html.ValidationSummary(true)
    <fieldset>
        <legend>Student</legend>

        <div class="editor-label">
            @Html.LabelFor(model => model.LastName)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.LastName)
            @Html.ValidationMessageFor(model => model.LastName)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.FirstName)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.FirstName)
            @Html.ValidationMessageFor(model => model.FirstName)
        </div>

        @*<div class="editor-label">
            @Html.LabelFor(model => model.EnrollmentDate)
        </div>
        <div class="datefield editor-field">
            @Html.EditorFor(model => model.EnrollmentDate)
            @Html.ValidationMessageFor(model => model.EnrollmentDate)
        </div>*@
        <div class="editor-label">
            @Html.LabelFor(model => model.EnrollmentDate)
        </div>
        <div class="editor-field">
            @Html.TextBoxFor(model => model.EnrollmentDate)
            @Html.ValidationMessageFor(model => model.EnrollmentDate)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.MiddleName)
        </div>
        <div class="editor-field " >
            @Html.EditorFor(model => model.MiddleName)
            @Html.ValidationMessageFor(model => model.MiddleName)
        </div>

        <p>
            <input type="submit" value="Create" />

    </fieldset>
}
<script>
      $(function () {
          $("#datepicker").datepicker();
      });
  </script>

<div>
    @Html.ActionLink("Back to List", "Index")
</div>

1 个答案:

答案 0 :(得分:1)

更改脚本

<script>
      $(function () {
          $("#EnrollmentDate").datepicker();
      });
  </script>