1

我正在使用 twitter 引导程序、mvc 和淘汰赛。我有一个模式,我从一个指向处理上传的页面的远程 url 打开。

我这样做是这样的:

<a class="btn btn-mini" data-toggle="modal"  data-bind="attr: { href: modalHref }" data-target="#UploadModal" >Uploads</a>


<div id="UploadModal" class="modal hide" style="display: none; " aria-hidden="true">
<div class="modal-header">
    <button data-dismiss="modal" class="close" type="button">×</button>
    <h3>Upload</h3>
</div>
<div class="modal-body form-horizontal" style="padding:0;">
</div>
<div class="modal-footer">
    <a data-dismiss="modal" class="btn" href="#" data-bind="click: saveCount">Save</a>
</div>
</div>

模态加载很好,里面的一切都很好。基本上我有一个文件上传器控件,用户可以在其中向我发布文件,我处理它,然后我返回列标题来处理它们。这是我在表单上的 ajax 函数:

function uploadSubmit() {
$.ajax({
    url: '/Upload/UserSaveFileInfo/',
    type: 'post',
    async: false,
    data: ko.toJSON({
        UploadName: $("#uploadName").val(),
        UploadDescription: $("#uploadDescription").val(),
        Id:  $('#uploadId').val()
    }),
    contentType: 'application/json',
    success: function (result) {
        $("#uploader").hide();
        for( var i = 0; i < result.length; i++)
        {
            viewModel.RetRows.push({
                Id: ko.observable(result[i].Id),
                Header: ko.observable(result[i].Header),
                MatchedTo: ko.observable(result[i].MatchedTo),
                Values: ko.observable(result[i].Values),
                ColumnNumber: ko.observable(result[i].ColumnNumber)
            });
        }
        $("#matcher").show();
    },
    error: function (jqXHR, textStatus, errorThrown) {
        console.log(data);
        alert(textStatus);
    }
});

}

这一切都有效,但是在我的远程加载模式中,我有一些代码试图从返回的数据中呈现一系列文本框/跨度,但它不起作用。我试图只查看模态中的其他 ko 变量,但它们没有显示出来,因此模态似乎不知道存在敲除或敲除无法访问模态内容...有没有办法使远程模态和ko同步?

<!-- ko foreach: RetRows -->
        <div class="control-group">
            <label class="control-label">
                Column <span data-bind="text: $data.ColumnNumber"></span>
            </label>
            <div class="controls">
                <input data-bind="value: $data.MatchedTo" />
                <span class="help-block" data-bind="text: $data.value"></span>
            </div>
        </div>
    <!-- /ko -->

我把它放在父页面中,一切都出现了。所以这似乎是模态中远程加载的内容的问题。有想法该怎么解决这个吗?也许有一种方法可以通过 bindingHandler 附加远程内容?感谢任何人都可以提供的任何见解。

4

1 回答 1

1

您需要将绑定应用到该模式。

ko.applyBindings(viewModel, document.getElementById("remote_modal"));
于 2013-04-18T17:01:22.183 回答