ajax发布后淘汰js更新视图模型

Posted

技术标签:

【中文标题】ajax发布后淘汰js更新视图模型【英文标题】:Knockout js Update viewmodel after ajax post 【发布时间】:2018-12-21 04:56:55 【问题描述】:

我正在使用 Knockout js 和 Knockout 映射插件。

我的问题是在调用 ajax 后我的视图 (ui) 没有更新。 只有当我重新加载页面时,数据才会更新。

<tbody data-bind="foreach: WorkData">
    <td data-bind="text: id"></td>
    <td data-bind="text: user_name"></td>
    <button class="btn btn-xs btn-success" data-bind="click: $parent.postTmpData" role="button">
        <span class="glyphicon glyphicon-ok" aria-hidden="true"></span>
    </button>
</tbody>

<script>
    function ViewModel() 
        var self = this;
        var data = <?php echo json_encode($this->data); ?> ;
        self.WorkData = ko.mapping.fromJS(data);

        self.postTmpData = function(entry) 
            $.post("<?php echo Config::get('URL'); ?>/work/confirmWorkPost/", entry, function(returnedData) 
                ko.mapping.fromJS(returnedData, self);
            )
        
    
    ko.applyBindings(new ViewModel());
</script>

【问题讨论】:

【参考方案1】:

returnedData 是您要替换 WorkData 的东西吗?只有当它们在相同的结构中时才有可能。在这种情况下,试试这个:

$.post("<?php echo Config::get('URL'); ?>/work/confirmWorkPost/", entry, function(returnedData) 
    ko.mapping.fromJS('WorkData': returnedData, self);
)

【讨论】:

我试过了,但没有帮助。带有“data-bind="foreach:WorkData" 的视图 (html) 仍未更新 还是不知道我的问题?我真的很想找到一个解决方案。 正如我所说,除非我可以调试,否则我无法判断出了什么问题...您可以通过什么方式共享项目,至少是相关部分?【参考方案2】:

这是我的解决方案:

ko.mapping.fromJS(JSON.parse(returnedData), self.WorkData);

【讨论】:

以上是关于ajax发布后淘汰js更新视图模型的主要内容,如果未能解决你的问题,请参考以下文章

淘汰赛仅更新部分视图模型

ko 视图模型在 js 上更新但未在 html 视图中显示

当页面通过ajax作为部分加载时,如何重新绑定淘汰视图模型?

添加项目以淘汰视图模型,不更新视图

杜兰达尔/淘汰赛。更新其他视图/视图模型

添加项目以淘汰视图模型,不会更新视图