ASP.NET MVC中AJAX POST请求日期输入绑定异常问题

核心原因 #

后端DateOnly类型的模型绑定需要严格匹配日期格式（默认期望ISO 8601格式：YYYY-MM-DD），而前端传递的日期格式不符合要求，导致绑定失败，最终使用DateOnly的默认值01-01-0001。

具体修复步骤 #

1. 给ViewModel的CheckInDate字段添加格式约束 #

在ViewModel中为CheckInDate属性添加[DisplayFormat]特性，明确指定日期格式：

public class BookingViewModel
{
    [DisplayFormat(DataFormatString = "{0:yyyy-MM-dd}", ApplyFormatInEditMode = true)]
    public DateOnly CheckInDate { get; set; }
    
    public int Nights { get; set; }
    // 其他属性...
}

2. 确保AJAX请求传递正确格式的日期 #

前端发送AJAX POST时，将checkInDate转换为YYYY-MM-DD格式的字符串再序列化：

// 假设使用jQuery
$.ajax({
    url: '/YourController/GetVillasByDate',
    type: 'POST',
    contentType: 'application/json',
    data: JSON.stringify({
        checkInDate: $('#checkInDate').val(), // 原生date输入的value默认就是YYYY-MM-DD
        nights: parseInt($('#nights').val())
    }),
    success: function(response) {
        // 处理返回的别墅列表
    }
});

如果使用自定义日期选择器，需手动格式化日期：

// 比如使用laydate或其他插件
const checkInDate = laydate.val('checkInDate').format('yyyy-MM-dd');

3. 修复Book按钮跳转的日期传递 #

点击Book按钮跳转到FinalizeBooking时，确保URL中的checkInDate参数是YYYY-MM-DD格式：

@foreach (var villa in Model.Villas)
{
    <a href="@Url.Action("FinalizeBooking", "Booking", new { 
        checkInDate = Model.CheckInDate.ToString("yyyy-MM-dd"), 
        nights = Model.Nights, 
        villaId = villa.Id 
    })" class="btn btn-primary">Book</a>
}

直接传递Model.CheckInDate可能会因服务器文化设置转为其他格式（如MM/DD/YYYY），导致后端无法解析。

4. 全局配置DateOnly绑定格式（可选） #

如果上述步骤仍未解决，可在Program.cs中全局配置DateOnly的绑定格式：

builder.Services.AddControllersWithViews()
    .AddMvcOptions(options =>
    {
        options.ModelMetadataDetailsProviders.Add(new DisplayFormatMetadataProvider(
            typeof(DateOnly),
            new DisplayFormatAttribute { DataFormatString = "{0:yyyy-MM-dd}", ApplyFormatInEditMode = true }
        ));
    });

验证要点 #

• 前端控制台打印的checkInDate必须是YYYY-MM-DD格式
• 查看AJAX请求的Payload，确认checkInDate的格式正确
• 检查Book按钮生成的URL，确保checkInDate参数为YYYY-MM-DD格式

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