2

我正在尝试使用 Kendo UI 选项卡创建一组将插入到 html 页面上的部分 html 文档。每个部分 html 文档将包含将出现在每个选项卡中的控件。在这些部分 html 文档中,我尝试使用 Knockout JS 将控件绑定到视图模型对象。

当我加载页面时,控件似乎没有绑定到视图模型。当我将部分 html 文档中的标签复制到主页时,绑定工作。

是否可以使用 kendo ui 标签条的动态加载功能加载这些控件?

这是我正在使用的一些示例代码:

主页:

    <!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>


    <script src="../Scripts/jquery-1.8.3.min.js"></script>
    <script src="../Scripts/knockout-2.2.0.js"></script>
    <script src="../Scripts/KendoUI/kendo.all.min.js"></script>
    <script src="../Scripts/ViewModels/EndorsementViewModel.js" defer="defer"></script>

    <link href="../Stylesheets/KendoUI/kendo.common.min.css" rel="stylesheet" />
    <link href="../Stylesheets/KendoUI/kendo.metro.min.css" rel="stylesheet" />
</head>
<body>

        <div>
            <div id="tabStrip">

            </div>
        </div>

</body>
</html>
<script>
    $(document).ready(function () {
        InitialKendoControls();

    });

    function InitialKendoControls() {
        InitialKendoTabStrip();
    }

    function InitialKendoTabStrip() {

        var tabstrip = $("#tabStrip").kendoTabStrip(
            {
                dataTextField: "text",
                dataContentField: "content",
                dataUrlField: "url",
                dataContentUrlField: "contentUrl",
                dataSource:
                [

                    {
                        text: "TestTab",
                        contentUrl: "../TestEndorsement/TestTab.html"
                    }
                ]
            }
            ).data("kendoTabStrip");

    }
</script>

部分 HTML:

<div>
    <span>Enter something</span><input data-bind="value: testValue" /><br />
    <button data-bind="click: testClick">Click Me</button>
</div>

查看型号:

function EndorsementViewModel()
{
    this.testValue = ko.observable("Test Value");

    this.testClick = function () { alert(this.testValue()); };
}
ko.applyBindings(new EndorsementViewModel());
4

1 回答 1

1

使用此contentLoad事件来执行应用绑定的逻辑(当前您使用文档读取事件)。如果该 Html 部分仍未加载,则绑定肯定无法正常工作。

于 2013-01-11T00:45:45.487 回答