Tempus Dominus v6.9.4 点击日期字段后时间异常及重置问题

问题现象 #

• 从.Net MVC 6后端传递DateTime对象到前端，初始显示正常，但点击日期字段打开选择器时，时间被强制改为AM
• 点击字段还会将值重置为当前日期时间
• 已尝试修改JS日期格式、模型DataFormatString，但未解决

解决方案 #

1. 修正日期格式解析逻辑

Tempus Dominus v6对12小时制的格式解析有特定要求，你之前用的T占位符不符合标准，换成a来表示AM/PM，同时指定明确的区域避免解析歧义：

修改JS配置中的localization部分：

localization: {
    dateFormats: {
        LLL: 'MM/dd/yyyy h:mm a', // 替换T为a
    },
    format: 'LLL',
    locale: 'en-US' // 显式指定区域
},

后端模型同步修改DataFormatString，保证前后端格式一致：

[DisplayFormat(DataFormatString = "{0:MM/dd/yyyy h:mm tt}", ApplyFormatInEditMode = true)]
public DateTime TargetDateTime { get; set; }

2. 禁用自动填充当前时间

点击重置为当前时间是因为组件默认开启了useCurrent，显式关闭这个配置即可：

在组件初始化配置中添加useCurrent: false：

new tempusDominus.TempusDominus(document.getElementById(elementId), {
    useCurrent: false, // 核心：关闭自动设置当前时间
    localization: {
        dateFormats: {
            LLL: 'MM/dd/yyyy h:mm a',
        },
        format: 'LLL',
        locale: 'en-US'
    },
    // 其余display配置保持不变
    display: {
        icons: {
            type: 'icons',
            today: 'bi bi-calendar-check',
            time: 'bi bi-clock',
            up: 'bi bi-arrow-up',
            down: 'bi bi-arrow-down',
            previous: 'bi bi-arrow-left',
            next: 'bi bi-arrow-right',
            clear: 'bi bi-trash-fill',
            close: 'bi bi-x'
        },
        sideBySide: true,
        keepOpen: false,
        buttons: {
            today: true,
            clear: true,
            close: true
        },
        components: {
            decades: true,
            clock: true,
            hours: true,
            minutes: true,
        },
        inline: false,
        theme: 'light'
    }
});

3. 确认前端输入框值格式正确

检查Razor生成的输入框value，确保后端输出的日期字符串严格匹配MM/dd/yyyy h:mm a格式（比如09/15/2024 3:45 PM），避免格式不匹配导致组件解析出错：

@Html.EditorFor(model => model.TargetDateTime, new { htmlAttributes = new { @class = "timepicker", @type = "text" } })

验证操作 #

1. 刷新页面，确认初始日期时间显示正常
2. 点击字段打开选择器，检查AM/PM显示是否正确，不会被强制修改
3. 点击字段后，值不会重置为当前时间

内容的提问来源于stack exchange，提问作者BattleFrog