使用DB2数据填充FullCalendar无数据显示问题求助

阿华AIGC实验室

2026-5-28

排查FullCalendar不显示DB2数据的问题

我来帮你一步步梳理可能的问题点，这种无报错但数据不加载的情况，通常是数据格式或前后端交互的细节没处理好：

1. 先确认后端返回的数据结构是否符合要求

FullCalendar的events参数需要接收对象数组，且每个事件的start字段必须是它能解析的日期格式（比如YYYY-MM-DD、YYYY-MM-DDTHH:mm:ss这类ISO标准格式）。

你可以先在前端AJAX的.done回调里加一行日志，看看返回的数据到底是什么样的：

.done(function (data) {
    console.log("返回的事件数据：", data.d); // 打印到浏览器控制台
    $('#calendar').fullCalendar({
        // ... 其他配置
        events: data.d
    });
});

如果控制台里data.d是字符串而不是数组，那就是序列化环节出了问题（看下面第3点）；如果数组里的start格式不对（比如MM/DD/YYYY或者奇怪的编码格式），FullCalendar会直接忽略这些事件。

2. 修复WebMethod的双重序列化问题

你当前的WebMethod返回的是string类型，而JavaScriptSerializer.Serialize(events)已经把列表转成了JSON字符串，但ASP.NET的WebMethod会自动对返回值再做一次JSON序列化，导致前端拿到的data.d是一个被双重包装的字符串（比如"[{\"title\":\"xxx\",\"start\":\"2024-05-20\"}]"），而不是直接可用的数组。

解决方法有两种：

方法一：修改WebMethod返回类型
把返回类型改成List<Event>，让ASP.NET自动帮你序列化，这样前端拿到的data.d就是直接可用的数组：

[WebMethod]
public static List<Event> GetEvents() {
    // ... 你的查询逻辑不变
    // 去掉JavaScriptSerializer的代码，直接返回events列表
    return events;
}

方法二：前端手动解析字符串
如果不想改后端，就在前端把data.d解析成JSON对象：
```
events: JSON.parse(data.d)
```

3. 确保Event类的属性可被正确序列化

你的Event类用的是公共字段（public string title;），虽然JavaScriptSerializer会序列化公共字段，但ASP.NET的WebMethod对属性的支持更稳定。建议改成带getter/setter的属性：

public class Event {
    public string title { get; set; }
    public string start { get; set; }
}

这能避免因字段序列化规则导致的JSON键丢失问题。

4. 验证DB2查询的日期格式是否正确

你用CAST(EDATE as char(20) ccsid 37)转换日期，ccsid 37是EBCDIC编码，转换后的字符串格式可能不符合FullCalendar的要求。可以在后端打印reader["EDATE"].ToString()的值，或者看前端返回的start字段，确认是不是类似2024-05-20这样的格式。

如果格式不对，建议在DB2查询里直接转成ISO格式的字符串，比如：

SELECT VARCHAR_FORMAT(EDATE, 'YYYY-MM-DD') as EDATE, ...

（具体函数可能因DB2版本略有不同，VARCHAR_FORMAT是常用的日期转字符串函数）

5. 捕获AJAX请求的潜在错误

目前你只处理了成功的情况，建议加上.fail回调来捕获可能的请求错误（比如后端抛出异常、网络问题）：

$.ajax({
    // ... 你的AJAX配置
})
.done(function (data) {
    // ... 初始化日历
})
.fail(function(xhr, status, error) {
    console.error("AJAX请求失败：", status, error);
    console.log("后端返回内容：", xhr.responseText);
});

很多时候“无报错”只是前端没捕获到错误，加上这个能帮你快速定位问题。