【问题标题】：Why aren't datepicker values assigning the form input a value为什么 datepicker 值不为表单输入一个值
【发布时间】：2017-09-26 12:18:19
【问题描述】：

我遇到了与这个问题类似的问题： Jquery datepicker selected date not assigning the value

但是给出的答案几乎是无用的。

我有一个 asp.net MVC 应用程序，其中详细信息从视图中的表单发送到控制器，但在调试时这些值只是默认的 DateTime 值。

在检查时，在输入或使用 JQuery UI 日期选择器时未分配值。

使用此脚本来利用 Jquery-ui Datepicker

<script>
$(document).ready(function() {
    $("#startDatePicker").datepicker();
    $("#endDatePicker").datepicker();
})
</script>

这是创建表单的代码，它封装在@using (Html.BeginForm()){ }

        <div class="form-group">
        @Html.LabelFor(model => model.End_Date, htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.EditorFor(model => model.End_Date, new { htmlAttributes = new { @class = "form-control", id= "endDatePicker" } })
            @Html.ValidationMessageFor(model => model.End_Date, "", new { @class = "text-danger" })
        </div>
    </div>

即使解释为什么会发生这种情况，我们也将不胜感激

谢谢。

编辑 - 模型：

 public partial class BPO
 {
    [System.Diagnostics.CodeAnalysis.SuppressMessage("Microsoft.Usage", "CA2214:DoNotCallOverridableMethodsInConstructors")]
    public BPO()
    {
        this.Order_Log = new HashSet<Order_Log>();
    }

    [Display(Name = "BPO")]
    public string BPO_ID { get; set; }
    [Display(Name = "Start Date")]
    public System.DateTime Start_Date { get; set; }
    [Display(Name = "End Date")]
    public System.DateTime End_Date { get; set; }
    [Display(Name = "In Use")]
    public bool In_Use { get; set; }
    [Display(Name = "Used For")]
    public string Used_For { get; set; }

    [System.Diagnostics.CodeAnalysis.SuppressMessage("Microsoft.Usage", "CA2227:CollectionPropertiesShouldBeReadOnly")]
    public virtual ICollection<Order_Log> Order_Log { get; set; }
}

编辑 2 - 控制器方法：

/**
     * Returns a View
     */
    public ActionResult AddBPO()
    {
        return View();  //Returns AddBPO.cshtml
    }

    /**
     * Adds a BPO Number to the BPO Database
     * @Param pO The BPO Number passed by POST
     */
    [HttpPost]
    public ActionResult AddBPO(BPO pO)
    {
        try
        {
            SFI.BPOes.Add(pO);                      //Add pO to the BPO Table
            SFI.SaveChanges();                      //Save the changes to the Database
            return RedirectToAction("RequestItem"); //Redirect to RequestItem
        }
        catch (Exception ex)
        {
            ViewBag.Message = ex.Message;   //Set the error message to the ViewBag
            return View(pO);                //Return AddBPO.cshtml with the data pO
        }
    }

【问题讨论】：

展示你的模型
你能发布你的模型和控制器
数据类型为 datetime 的开始日期和结束日期都会发生这种情况
是的，唯一成功通过的是 BPO_ID
所以我看不到您在日期选择器点击事件的任何地方分配所选值的位置或您有什么。在引用的 Stack Overflow 文章中，您可以看到点击事件。

标签： c# asp.net asp.net-mvc datepicker jquery-ui-datepicker

【解决方案1】：

我找到了解决办法。（更多解决方法查看实际修复的编辑）

日期是通过邮寄传递的，但由于格式不正确而没有转换为日期时间

为了解决这个问题，我们直接从 POST 获取数据 Request["Start_Date"] Request["End_Date"]

然后将数据格式化成System.DateTime可以解析的字符串

private string FormatToDate(String date)
{
    string formattedDate = date.Substring(6,4) +"/"+ date.Substring(0,2) + "/" + date.Substring(3,2) +" 00:00:00.000";
    return formattedDate;
}

这是修复它的最终代码

BPO newBPO = new BPO()
{
    BPO_ID = bPO.BPO_ID,
    Start_Date = DateTime.Parse(FormatToDate(Request["Start_Date"].ToString())),
    End_Date = DateTime.Parse(FormatToDate(Request["End_Date"].ToString()))
};

编辑：

修复

（非解决方法）

使用 DataAnnotations 在模型中设置 DataType。

using System.ComponentModel.DataAnnotations;

[DataType(DataType.Date)]
[Display(Name ="Start Date")]
public DateTime Start_Date { get; set; }

这将提供一个日期选择器，使 jquery-ui api 变得多余，并允许通过 POST 传递数据

【讨论】：

【解决方案2】：

试试这个 @Html.EditorFor(model => model.End_Date, new { htmlAttributes = new { @class = "form-control", @id= "endDatePicker" } })

【讨论】：

这完全没有区别。而你只需要htmlAttributes中的@，当它是一个保留的关键字（例如class）

【解决方案3】：

 $(function () {
         $("[id$=input__Dob]").datepicker({
             dateFormat: 'yy/mm/dd',
             showOn: 'button',
             buttonImageOnly: true,
             buttonImage: '../Images/calender.png'
         });
     });

// input__Dob : 文本框 id 文本框的buttonImage一侧是calender.png 确保图像在文件夹中

【讨论】：