指定的值不符合所需的格式 yyyy-MM-dd

我有一个使用数据注释、实体框架 Jquery 2.1.3 和 Jquery UI 1.11.4 的 .Net MVC 5 应用程序。

当我使用英国格式"dd/MM/YYYY"呈现输入类型为日期的编辑表单时;使用谷歌浏览器时出现以下错误消息：

指定的值"10/10/2001"不符合所需的格式"yyyy-MM-dd"。 jquery-2.1.3.js：5317

型

public class MyModel
{
    [Column(TypeName = "date"), DataType(DataType.Date), Display(Name = "My date")]
    [DisplayFormat(DataFormatString = "{0:dd/MM/yyyy}")]
    public string MyDate { get; set; }
}

标记

<input class="text-box single-line" data-val="true" data-val-date="The field My date must be a date." id="MyDate" name="MyDate" type="date" value="10/10/2001" />

在输入控件中正确设置了该值，但日期未显示在浏览器中。我最初认为这是jQuery的问题，因为它出现在jQuery脚本文件中，但是在IE和Firefox中进行测试时，一切正常。

然后我假设这是我在 chrome 中的区域设置，因为默认情况下 Chrome 认为每个人都在美国是英语，我将区域设置更改为英国，但仍然出现相同的问题。

一个简单的解决方法是将我的模型中的格式更改为通用格式，但对于英国用户来说，这有点陌生。

有没有办法告诉 chrome 接受"dd/MM/YYYY"中的日期格式？

HTML5 日期选取器的规范规定日期必须采用格式yyyy-MM-dd（ISO 格式）。这意味着您必须DisplayFormatAttribute

[DisplayFormat(DataFormatString = "{0:yyyy-MM-dd}", ApplyFormatInEditMode = true)]
public string MyDate { get; set; }

或者，您可以使用以下方法手动添加格式

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

后面的选项允许您保留DataFormatString = "{0:dd/MM/yyyy}")以供@Html.DisplayFor()使用

你不需要任何jquery或ASP功能来修复它。简单的JS就可以了。问题是浏览器需要格式 yyyy-mm-dd。

toLocaleString 不允许日期采用这种格式。所以在搜索之后，我发现这是ISO格式，我们可以使用Date（）.toISOString（）来获取所需格式的日期。

我使用 slice 方法提取日期部分只是因为 Date（）.toISOString（）返回日期和时间。

我的代码：

date: new Date().toISOString().slice(0, 10)

问题可能来自 type="date"。无论如何，这就是我的情况。一旦更改为类型="文本"，就可以工作了。如果接口是使用 MVC 包装器构建的，则需要相应地替换或设置 html 属性。

您可以使用

InputTagHelper.Format

<input asp-for="MyDate" asp-format="{0:yyyy-MM-dd}" />

https://docs.asp.net/projects/api/en/latest/autoapi/Microsoft/AspNetCore/Mvc/TagHelpers/InputTagHelper/#prop-Microsoft.AspNetCore.Mvc.TagHelpers.InputTagHelper.Format

我遇到了同样的问题我这样做了，它开始工作了

<input type="date" class="form-control text-box single-line" id="EndDate" name="EndDate" value=@Model.EndDate.ToString("yyyy-MM-dd") />

将 type 属性设置为文本。

@Html.TextBoxFor(m => m.MyDate, new { @type = "text"  })

我想

在这里的答案中强调一些东西。

如果要构建具有全球化和本地化的应用程序，则使用 Html 帮助程序传入格式的方法会更好。您也可以只使用 EditorFor 并为日期选择器传入必要的 id 或类。

我通过将值分配给 html5 日期输入来收到此警告。我只是根据它的罚款转换为所需的格式（yyyy-MM-dd）。

我所有的逻辑是计算下一个日期并分配给其他日期输入。我将分享我的整个逻辑。

网页代码：

  <input type='date' name="booking_starts" id="booking_starts" autocomplete="off" />
  <input type='date' name="booking_ends" id="booking_ends" autocomplete="off" />

Js 代码：

   $('#booking_starts').change(function() {
        var start   = $("#booking_starts").val();
        var result  = new Date(start);
        var end     = result.setDate(result.getDate() + 1);
        $("#booking_ends").val(dateToYMD(end));
    });
    function dateToYMD(end_date) {
        var ed = new Date(end_date);
        var d = ed.getDate();
        var m = ed.getMonth() + 1;
        var y = ed.getFullYear();
        return '' + y + '-' + (m<=9 ? '0' + m : m) + '-' + (d <= 9 ? '0' + d : d);
    }

如果其他人遇到这种情况，就我而言，这是因为我约会中的一天只有一个数字，这把它搞砸了。如果您的日期少于 10 天，请务必执行new Date().toLocaleString("en-US", { day: "2-digit" });

一个对我有用的简化解决方案是。

  // Format: YYYY-MM-DD
  const day = new Date().toLocaleString("en-US", { day: "2-digit" });
  const month = new Date().toLocaleString("en-US", { month: "2-digit" });
  const year = new Date().getFullYear();
  // Assign to input variable
  document.getElementById("reservation_date").value = `${year}-${month}-${day}`;

相关内容

最新更新

热门标签：