FullCalendar 3.1.0如何通过日期获取对应事件的title、description等属性

步骤1：调整后端接口返回数据结构 #

你当前使用的GetEvent接口仅返回日期|事件ID格式的字符串，缺少所需的title、description字段，首先修改后端逻辑，在返回的拼接字符串中新增这些字段，参考格式：
{日期}|{事件ID}|{事件标题}|{事件描述}
如果允许调整接口规则，更推荐后端直接返回JSON对象而非分割字符串，后续扩展性更强。

步骤2：修改前端自动补全的数据映射逻辑 #

在autocomplete的success回调的$.map方法中，把新增的字段也解析到返回的item对象中：

success: function (data) {                           
    response($.map(data.d, function (item) {
        const arr = item.split('|');
        return {
            label: arr[0] ,
            val: arr[1],
            title: arr[2], // 对应新增的事件标题
            desc: arr[3] // 对应新增的事件描述
        }                            
    }))
},

步骤3：在select回调中给弹窗字段赋值 #

打开弹窗之前，把对应字段的值写入弹窗内的输入元素即可，示例代码如下，注意把选择器替换成你弹窗里实际的表单元素ID：

select: function (e, i) {
    $("[id$=hfCustomerId]").val(i.item.val);
    date = moment(i.item.label, "DD/MM/YYYY HH:mm");
    $("#calendar").fullCalendar('gotoDate', date);
    // 给弹窗表单赋值
    $("#update_title").val(i.item.title);
    $("#update_description").val(i.item.desc);
    $('#updatedialog').dialog('open');
},

备选方案：从已加载的FullCalendar事件中获取数据 #

如果你的FullCalendar已经预先加载了所有日历事件，不需要修改后端接口也可以实现，直接在select回调中通过事件ID/日期匹配对应事件即可：

select: function (e, i) {
    $("[id$=hfCustomerId]").val(i.item.val);
    const eventId = i.item.val; // 假设val字段存储的是事件唯一ID
    date = moment(i.item.label, "DD/MM/YYYY HH:mm");
    $("#calendar").fullCalendar('gotoDate', date);
    // 从fullCalendar的已加载事件中匹配对应事件
    const targetEvent = $("#calendar").fullCalendar('clientEvents', eventId)[0];
    if(targetEvent) {
        $("#update_title").val(targetEvent.title);
        $("#update_description").val(targetEvent.description);
    }
    $('#updatedialog').dialog('open');
},

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