@Html.Partial 之后的 Ko 绑定不起作用

Question

我有以下代码cshtml

<div class="container-fluid" id="dvUserData">
    <div class="tab-pane fade" id="documentos" role="tabpanel" aria-labelledby="documentos-tab">
                    @Html.Partial("Documentos")
                    <div class="col-md-3">
                        <button type="submit" class="btn btn-primary botao-vert" data-bind="click: editData">SALVAR</button>
                    </div>
                </div>

和以下绑定

ko.applyBindings(model, document.getElementById("dvUserData"));

但是我的data-bind="click: editData"不起作用，点击没有执行。但是如果我把 div class="col-md-3" 放在 @Html.Partial("Documentos" ) 绑定有效。

我不知道为什么，我在这里找了帖子，但找不到类似的东西。在此先感谢您的帮助。

---已编辑

部分

<div class="row" id="dvDocument">
    <form role="form">
        <div class="row">
            <div class="col-12">
                <table class="table tabela-documentos">
                    <tbody data-bind="foreach: documentsReturn().documentTypes">
                        <tr class="bg-cinza">
                            <td>
                                <div class="aviso-sucesso" data-bind="visible : hasAllDocuments()"></div>
                                <div class="aviso-critica" data-bind="visible : !hasAllDocuments()"></div>  <span data-bind="text: Description"></span>
                            </td>
                            <td>
                                <span class="d-none" data-bind="value: IdTypeDocument"></span>
                                <a class="btn btn-secondary" data-bind="click: function () { $parent.saveTypeDocument(IdTypeDocument); $('.alerta-form2').hide();}" data-toggle="modal" data-target="#modalDocumento">
                                    ADICIONAR
                                </a>
                            </td>
                        </tr>
                        <!-- ko foreach: DocumentsArray() -->
                        <tr>
                            <td><i class="fa fa-file-text-o" aria-hidden="true"></i> Inclusão: <span data-bind="text: NewDate"></span></td>
                            <td>
                                <i class="fa fa-times pointer" data-toggle="modal" data-target="#modal-confirmation" aria-hidden="true" data-bind="visible : !frombase(),
                                                       , click: function(){ @*if (confirm('Deseja realmente deletar o documento?')) {*@ $parent.savePath(Path); @*}*@ }"></i>
                            </td>
                        </tr>
                        <!-- /ko-->
                    </tbody>
                </table>

            </div>
        </div>
        <div class="alert-button">

        </div>
    </form>
</div>

我忘了说我还有另一个 javascript 文件绑定了 div 文档和不同的模型。

Answer 1

按 F12 并检查是否有任何 knockout js init (ko.applyBindings) 错误。有的话修复一下试试

如果不存在错误，请确保通过调试代码为 model.Name() 属性设置了一个值。

并检查您的部分视图，看看您是否已将范围/绑定上下文缩小到您模型的另一个复杂属性，该模型也具有名称属性。

如果您能提供更多关于部分视图绑定声明以及如何设置/加载模型初始值的信息，那就更好了。

Answer 2

在寻找解决方案并与一些朋友交谈后，我发现了问题所在。我正在绑定具有 div ID "documentos" 的主要 div 和其他信息，这就是问题所在。我删除了 dvUserData 的绑定，并将绑定放入我拥有的所有 div 中，包括为按钮创建一个新的 div。

这就是我的 div "documentos" 现在的样子。

<div class="tab-pane fade" id="documentos" role="tabpanel" aria-labelledby="documentos-tab">

                        @Html.Partial("Documentos")
                        <div class="alert-button mb-3">
                            <div id="dvDocumentValidate">
                                <button type="submit" class="btn btn-primary botao-vert" data-bind="click: editData">SALVAR</button>
                            </div>
                        </div>
                    </div>

还有我的绑定

ko.applyBindings(model, document.getElementById("dvLoading"));
ko.applyBindings(model, document.getElementById("personaldata"));
ko.applyBindings(model, document.getElementById("address"));
ko.applyBindings(model, document.getElementById("databank"));
ko.applyBindings(model, document.getElementById("dvDocumentValidate"));
ko.applyBindings(model, document.getElementById("corporatedata"));

@Html.Partial 之后的 Ko 绑定不起作用

Ko Bindings after @Html.Partial do not work

html

javascript

razor

knockout.js