设置输入类型=日期

Set Input type=date

本文关键字:日期 类型 输入 设置      更新时间:2023-09-26

非常感谢您抽出时间

我的问题是如何设置日期类型的值输入?

@Html.EditorFor(model => model.StartDate, new { htmlAttributes = new { @class = "form-control", @type = "date" } })

在运行之后

<input class="form-control text-box single-line" data-val="true" data-val-date="The field Date must be a date." data-val-required="The Date field is required." id="StartDate" name="StartDate" type="date" value="">

我用这种方式做了一些代码

$(document).ready(function () {
    debugger;
    var date = $('#StartDate').val();
    var dt = new Date(date);
    var day = parseInt(dt.getDate());
    var month = parseInt(dt.getMonth() + 1);
    var year = parseInt(dt.getFullYear());
    if (day < 10) { day = '0' + day }
    if (month < 10) { month = '0' + month }
    var setDate = year + '-' + month + '-' + day;
    $('#StartDate').val(setDate);
});

当程序运行时,我看到调试器屏幕上的值是字符串。空

var date = "";

我也试图删除这个格式错误的下半部分再次。

var dt = new Date(date);

但是我没有工作。如果有人知道答案的话我真的需要帮助终于有了数据,但由于格式不同,值未显示。此要求的格式(yyyy-MM-dd)

谢谢大家。

您的脚本是不必要的,并且由于属性StartDate是可为null的DateTime?并且没有值(您的html具有value=""),因此var dt = new Date(date);将返回Invalid date,因为var date = $('#StartDate').val();返回null,并且脚本失败。

在将模型传递到视图之前,您需要在控制器中设置StartDate的值,例如

var model = new MyModel() { StartDate = DateTime.Today };
return View(model);

其将在输入中显示今天的日期。

为了显示所需的格式,您可以添加DisplayFormatAttribute

[DisplayFormat(DataFormatString = "{0:yyyy-MM-dd}", ApplyFormatInEditMode = true)]
[DataType(DataType.Date)]
public DateTime? StartDate { get; set; }

注意,添加DataTypeAttribute意味着您可以从EditorFor()方法中省略type="date",因为它将由方法添加

或者,您可以省略这两个属性并使用

@Html.TextBoxFor(m => m.StartDate, "{0:yyyy-MM-dd}", new { @class = "form-control", type = "date" }})