Question

我试图在渲染时在月视图的每个单元格中插入一个自定义html表。为此，我使用ajax调用服务。该服务返回一个html表，我将其输入到单元格中。

要执行此操作，我在fullcalender.js中输入了以下代码

bodyCells.each(function (i, _cell) {
                cell = $(_cell);
                date = indexDate(i);
                if (date.getMonth() == month) {
                    cell.removeClass('fc-other-month');
                } else {
                    cell.addClass('fc-other-month');
                }
                if (+date == +today) {
                    cell.addClass(tm + '-state-highlight fc-today');
                } else {
                    cell.removeClass(tm + '-state-highlight fc-today');
                }
                cell.find('div.fc-day-number').text(date.getDate());

                //Paras Change
                $(CallService(date)).appendTo(cell.find('div.fc-day-content').empty());

                if (dowDirty) {
                    setDayID(cell, date);
                }


            });

在函数“bodyCells.each”中。其中CallService是我对函数的调用，而函数又调用该服务。

我对该服务的调用是在另一个javascript文件fullcalenderDataHelp.js中，代码如下。

function CallService(date) {
    var table = null;
    var newDate = (date.getMonth() + 1) + '/' + (date.getDate()) + '/'+date.getFullYear();
    $.ajax({
        type: "POST",
        url: "http://localhost:57747/ScheduleServer.svc/GetScheduleByDay",
        data: '{"day":"' + newDate + '"}',
        timeout: 7000,
        contentType: "application/json",
        success: function (response, textStatus, jqXHR) {
            table = $.parseJSON(response.d)
        }
    })

   //alert(table);   
   return table;

}

当html表被硬编码但当我进行实际的ajax调用并尝试显示html表时它起作用，它似乎不起作用。我认为ajax调用需要更多时间或其他事情。

我很感激任何帮助。

谢谢，第

Answer 1

我知道这是一篇旧帖子。自从我提出问题并在我的项目中使用它以来，日历插件本身已经走了很长的路。这与版本1.5.4相关。不知道你是否仍然可以在当前版本中使用它。我在下面提到的plunk中有原始的fullcalender.js。

我最初的问题是如何在月视图的每个单元格中添加自定义HTML。

在我发布问题后的几天内，我找到了答案，但我在那时没有常识将其发布在这里。我一直认为，我可能会从一些可能会回答它的专家那里得到更好的方法。

那天从来没有来过。我今天试图访问该网站，看看这是否是以后版本中包含的功能，但我找不到任何相关内容。

答案结果相当微不足道。在bodyCells.each的函数内部，我添加了一行代码，如下所示。

$(CallService(date)).appendTo(cell.find('div.fc-day-content').empty());

CallService(date)是一个返回一些html的函数，该html被附加到包含作为参数传递的日期的单元格。

这是一个有效的plunker。

但有一点要记住。在加载月视图上的每个单元格之前调用此函数。这意味着此函数调用将导致延迟。

希望能帮助那些在基本全日历月份视图中需要自定义HTML的人。

Arshaw fullcalendar在月视图的每个单元格中添加自定义html

1 个答案: