【JS】Knockout动态刷新及绑定数据

<script>
    // Knockout ViewModel Define
    function RemarkTemplateModel() {
        var self = this;        // Current Instance
 
        self.RemarkTemplate = ko.observableArray([]);
 
        self.RemarkTemplateDelete = function (data) {
            if (confirm('是否删除该说明模板?该操作不可恢复!')) {
 
                customerAlert('操作成功', '成功删除模板:' + data.TempateName, 'success', function () {
                    self.RemarkTemplate.remove(data);
                });
            }
        }
    }
 
    var viewModel = new RemarkTemplateModel();
 
    $(function () {
        ko.applyBindings(viewModel);
 
        // 加载数据
        $.getJSON('/manage/RemarkTemplate/ProjectDescTempleteGetView', function (data) {
            if (data.ResponseCode != 0) {
                viewModel.RemarkTemplate(JSON.parse(data.ResponseData));
            }
            else
                customerAlert('操作成功', data.ResponseMessage, 'error');
        });
    });
</script>
 
<div class="container-fluid">
 
    <table class="table table-bordered table-condensed table-hover">
        <tbody data-bind="foreach:RemarkTemplate">
            <tr>
                <td><span data-bind="text: TempleteName"></span></td>
                <td><button type="button" data-bind="click: $parent.RemarkTemplateDelete">删除</button></td>
            </tr>
        </tbody>
        <tbody data-bind="attr:{hidden:viewModel.RemarkTemplate().length >0}">
            <tr>
                <td colspan="2">无数据</td>
            </tr>
        </tbody>
    </table>
</div>

  

原文地址:https://www.cnblogs.com/briny/p/4654185.html