在 knockout.js 中将日期格式从 dd/mm/yyyy 更改为 yyyy-mm-dd

Question

我没有使用经验knockout.js。我继承了一个混合使用淘汰赛和 C# ASP.NET 的预订表格。我们最近将数据库升级到最新版本MySQL，与旧版本相比，它在输入日期的格式方面更加讲究。在大多数情况下，我已经能够通过调整 C# 或 SQL 来解决这个问题，但在表单的一部分中我还没有找到解决方案。日期以 dd/mm/yyyy 格式预填充到表单输入中。我想将其更改为 yyyy-mm-dd 以便我可以使用日期输入而不是文本输入

有两个表单输入，如下所示

<input type="text" size="10" maxlength="10" class="normaltext" data-bind="attr:{id:'returnDate-'+Id},value:FlightInfo.ReturnDate, enable:$root.FlightsAdvanced() == 'true' && !FlightInfo.OwnFlight()">

另一个显然是关于出发日期的。它们似乎是从 javascript 文件中的以下函数填充的。

function FlightInfo(depDate, retDate) {

 this.OwnFlight = ko.observable(false);
 this.FirstCode = ko.observable("");
 this.SecondCode = ko.observable("");
 this.DepartureDate = ko.observable(depDate);
 this.ReturnDate = ko.observable(retDate);
 this.ReqTransferIn = ko.observable(0);
 this.ReqTransferOut = ko.observable(0);
}

如果我用硬编码日期（例如 2020-09-09）替换 ko.observable(retDate) 并提交表单，那么它就可以工作，但是如果我将相同的日期直接硬编码到文本输入中代替value:FlightInfo.ReturnDate 然后它就不会了 - 表格从 knockout 中获取错误格式的日期并抛出错误。

我试过按照 this question 中的建议使用 moment.js，但它对我不起作用。如何将 depDate 和 retDate 重新格式化为 yyyy-mm-dd

Answer 1

使用moment.js是实现这个的正确方法，创建flightInfo时，两个observables应该这样修改：

 this.DepartureDate = ko.observable(moment(depDate).format('YYYY-MM-DD'));
 this.ReturnDate = ko.observable(moment(retDate).format('YYYY-MM-DD'));

如果这些更改没有反映在您的文本输入中，那么如果您以正确的方式包含并激活了 moment.js，那么您应该进行调试。

Answer 2

我最终通过将 .ToShortDateString() 的几个实例更改为 .ToString("yyyy-MM-dd") 在 C# 层解决了这个问题。

在 knockout.js 中将日期格式从 dd/mm/yyyy 更改为 yyyy-mm-dd

Changing date format from dd/mm/yyyy to yyyy-mm-dd in knockout.js

javascript

webforms

knockout.js