1

我试图在呈现时在月视图的每个单元格中插入一个自定义 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调用需要更多时间或其他东西。

我将不胜感激。

谢谢，帕拉斯

4

1 回答 1

0

我知道这是一个旧帖子。自从我提出这个问题并在我的项目中使用它以来，日历插件本身已经走了很长一段路。这与版本 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 的人。

于 2016-05-26T15:16:22.157 回答