Javascript 更新Kendo调度程序控件-dateHeaderTemplate的自定义标头

我已经为剑道调度程序编写了自定义头。如下所示

用于到达上述UI的代码如下所示，工作起来很有魅力。（多亏了Dion Dirza）

#=kendo.toString（日期，“dd/M”）#-（{dc}%）
$（“#调度程序”）.kendoScheduler({
dateHeaderTemplate:kendo.template（$（“#tmpDateHeader”）.html（））
}

问题

现在，我正在更新Kendo Scheduler中的一个事件。在此更新过程中，我希望根据一些数据手动更改列日标题百分比，例如从1%更改为5%（将来自DB），而不刷新整个计划程序控件

实时场景：当我为一天添加更多事件时，列标题中的百分比应该增加。获取百分比和颜色的逻辑在API中可用

解决方案方法

在这里，我想，我需要使用jQuery更新这个值

---

问题已解决：我刚刚在update fire上更新了数据源。

您可以查看数据源事件。现在我假设您的事件模型中有

Date

属性。您需要获取更新的事件

Date

，然后选择match

Date header

下面是一个示例代码：

var dateChanged = null;

function onDsChange(e) {
    var action = e.action;

    switch(action) {
    case "itemchange":
        var items = e.items; // all item that you have changed
        var item = items[0]; // I assume you are not doing batch editing 

        dateChanged = item.date; // if you are doing batch then dateChange should be array of date
        break;
    case "sync": // you also can do this inside grid databound event
        // grab actual data from API and do update the header
        .......
        // if this batch editing you need to do this inside a loop
        var selector = ".k-nav-day[data-dt='" + dateChange + "']";
        var elDateHeader = $(selector);
        var tempText = elDateHeader.text();
        var newText = tempText.replace(/\((.+?)\)/g, "(" + newPercentage + ")");

        elDateHeader.text(newText);
        break;
    }
}

---

你应该看看他们的，这样你可以得到调度程序的行为，就像它应该的那样。希望这有帮助。

我查看了dion dirza dojo提供的答案，那么在“调度程序数据绑定”上创建ajax调用如何将replace和jQuery css thing函数放在ajax调用成功函数中？是的，方法很完美，让我试试。我认为会有一种简单的方法来更新标题。迪翁，你能看看这个吗？当然，让我们看看你现在遇到了什么…）

var dateChanged = null;

function onDsChange(e) {
    var action = e.action;

    switch(action) {
    case "itemchange":
        var items = e.items; // all item that you have changed
        var item = items[0]; // I assume you are not doing batch editing 

        dateChanged = item.date; // if you are doing batch then dateChange should be array of date
        break;
    case "sync": // you also can do this inside grid databound event
        // grab actual data from API and do update the header
        .......
        // if this batch editing you need to do this inside a loop
        var selector = ".k-nav-day[data-dt='" + dateChange + "']";
        var elDateHeader = $(selector);
        var tempText = elDateHeader.text();
        var newText = tempText.replace(/\((.+?)\)/g, "(" + newPercentage + ")");

        elDateHeader.text(newText);
        break;
    }
}