Question

我正试图在运行时用JavaScript修改Kendo UI模板。

我的模板包含一个'103'（第二行），我想在JavaScript中动态更改。

<script type="text/x-kendo-tmpl" id="srcBldgTemplate">
     #if(data.BuildingName == '103'){#
        <div  class="item click" data="${BuildingID}">
            <input id=chkSrcBldgMain type="checkbox" class="click" checked="true"  onclick="filterDataSrcBldg(this,'SrcBuildingID');" />
            <span class="checkbox">#:BuildingName#</span>
        </div>
    #}else{#
    <div class="item click" data="${BuildingID}">
        <input type="checkbox" class="click"  onclick="filterDataSrcBldg(this,'SrcBuildingID');" />
        <span class="checkbox">#:BuildingName#</span>
    </div>
    #}#       
</script>

我用来修改的代码用于替换元素的html。

$("#srcBldgTemplate").html().replace('103', $(currChkBldg).next().html());

然而，当我在$（“＃srcBldgTemplate”）。html（）之后运行警报时，我在模板中不断获得103而不是新值。

当Kendo重新加载模板时，如何动态更改模板并使用更新的模板值？

Answer 1

您的问题是.html()是 GET 方法。它只获取模板的副本，因此当您替换该值时，它会更改副本实例，但不会更改原始值。

为了设置新模板，您必须使用.html(htmlString)

所以做这样的事情：

var newTemplate = $("#srcBldgTemplate").html().replace('103', $(currChkBldg).next().html());
$("#srcBldgTemplate").html(newTemplate);

获取并替换模板，将其存储在临时变量中。然后，您可以将该临时变量设置为新模板。

Kendo UI - 如何在JavaScript中修改Kendo模板

1 个答案: