为工具提示添加自定义数据到 Kendo UI 日历答案

【问题标题】：Add Custom Data To Kendo UI Calendar For Tooltip为工具提示添加自定义数据到 Kendo UI 日历
【发布时间】：2015-11-06 18:06:21
【问题描述】：

我有以下日历和工具提示：

$("#achCalendar").kendoCalendar({
    dates: events,
    navigate: MonthNavigate,
    change: DateChange,
    value: cur,
    month: {
        // template for dates in month view
        content: "# if ($.inArray(data.date.formatMMDDYYYY(), events) != -1) { data.title('check check'); #" +
                        "<div class='" +
                    "# if (data.date < currentDate) { #" +
                        "past" +
                    "# } else if (data.date.formatMMDDYYYY() == currentDate.formatMMDDYYYY()) { #" +
                        "current" +
                    "# } else { #" +
                        "future" +
                    "# } #" +
                "'>#= data.value #</div>" +
            "# } else { #" +
            "#= data.value #" +
            "# } #"
    },
    footer: "Today - #=kendo.toString(data, 'd') #"
});

var tooltip = $("#achCalendar").kendoTooltip({
    filter: "td .k-link",
    width: 120,
    position: "top",
    content:  function(e) {
        var target = e.target; // the element for which the tooltip is shown
        return target.data("title"); // set the element text as content of the tooltip
    }
}).data("kendoTooltip");

我想做的是每天添加一些将出现在工具提示中的自定义文本。我想每天更新标题，但这似乎不起作用，至少我尝试这样做的方式是这样。

有什么想法吗？提前致谢。

【问题讨论】：

标签： kendo-ui calendar telerik kendo-tooltip

【解决方案1】：

这是 Telerik 的回应：

$(document).ready(function() {

      $("#achCalendar").kendoCalendar({
        dates: events,         
        month: {
          // template for dates in month view
          content: "# if ($.inArray(+data.date, events) != -1) { #" +
          "<div data-tooltip='#=kendo.toString(data.date, \"d\")#' class='" +
            "# if (data.date < currentDate) { #" +
            "past" +
            "# } else if (data.date == currentDate) { #" +
            "current" +
            "# } else { #" +
            "future" +
            "# } #" +
            "'>#= data.value #</div>" +
            "# } else { #" +
            // wrap the text in a div in order to add the data-tooltip
            "<div data-tooltip='#=kendo.toString(data.date, \"d\")#'>#= data.value #</div>" +
            "# } #"
        },
        footer: "Today - #=kendo.toString(data, 'd') #"
      });

      $("#achCalendar").find(".k-state-selected").removeClass("k-state-selected");

      var tooltip = $("#achCalendar").kendoTooltip({
        filter: "td .k-link>div", // target the inner element to which the data-tooltip is added
        width: 120,
        position: "top",
        content:  function(e) {
          var target = e.target;                            
          return target.data("tooltip"); 
        }
      }).data("kendoTooltip");
    });

这是 Dojo 示例

http://dojo.telerik.com/@rkonstantinov/iwuNU

【讨论】：