Question

我正在尝试将可观察对象绑定到从服务器加载的表单。我可以在javascript端查看数据，但我无法在HTML端看到它，为什么？

这是我的客户要求提供表格：

self.showEntryDialog = function (elementId, title, partialViewName, verb, errorMessage) {
    var response = null;

    $.ajax({
        type: "GET",
        url: "/Home/ServeView/",
        data: { partialView: partialViewName },
        async: false,
        success: function (text) {
            response = text;
        },
        error: function (xhr, status, error) {
            $("#errorPane").append(errorMessage + ": " + xhr.status + " " + error);
        }
    });

这是服务器传递部分视图：

public ActionResult ServeView(string partialView)
    {
        return PartialView(partialView);
    }

加载视图后，它会将其附加到对话框：

if (response != null) {
        $("#" + elementId).dialog("destroy");

        $("#" + elementId).html(response);

        $("#" + elementId).dialog({
            autoOpen: false,
            width: 600,
            height: 400,
            modal: true,
            title: title,
            buttons: [

这是将加载到对话框中的服务器中的HTML：

<!-- ko with: chosenDetailData -->
<form>
    <label for="txtID">ID:</label>&nbsp;<input type="text" id="txtID" data-bind="value: ID" disabled /><br />
    <label for="txtTableID">Table ID:</label>&nbsp;<input type="text" data-bind="value: TableID" id="txtTableID" /><br />
    <label for="txtColumnID">Column ID:</label>&nbsp;<input type="text" data-bind="value: ColumnID" id="txtColumnID" />
</form>
<!-- /ko -->

这里是selectedDetailData的设置位置：

<tr data-bind="click: function () {
            $root.chosenDetailData(new MultilingualViewModel($data.ID, $data.TableID, $data.ColumnID));
            $root.showEntryDialog('EntryDialog',
                'Edit table for multilingual support', '_EditMultilingual', 'PUT', 'Unable to load the view');
        }">

“chosenDetailData”是我的主视图模型的可观察属性。主视图模型早先绑定，其他可观察的工作正常。

这是“MultilingualViewModel”：

function MultilingualViewModel(id, tableId, columnId) {
var self = this;

self.ID = id;
self.TableID = tableId;
self.ColumnID = columnId;
}

当我在向服务器提交信息之前检查self.chosenDetailData时，我可以看到我的数据，但它不会显示在从服务器收到的表单上。为什么呢？

Answer 1

您需要为新HTML调用applyBinding。

ko.applyBindings(yourViewModel.chosenDetailData(), document.getElementById("newHtmlId"));

Knockout.js绑定到动态生成的对话框

1 个答案: