0

如果 Ajax 调用中返回的 JSON 与我使用两个不同的模型一样，如果文本框值发生更改，我想在列表中进行过滤。过滤应该显示隐藏或仅过滤我为您提供的数据，即我从 ajax 调用中获得的 JSON 数据。谢谢

    Data = [{"code":"Grand Financial","cls":"Branch","Chk":true},{"code":"Joan Group","cls":"Branch","Chk":true}]



     var searchModel, advisorGroupModel;
        $(document).ready(function () {
          $.ajax({
                type: "GET",
                url: '/ASPNET/Reports/GetAdvisorGroups',
                dataType: "json",
                success: function (data) {
                    advisorGroupModel = {
                        advisorGroup: ko.observableArray(data)
                    };
                    ko.applyBindings(advisorGroupModel, document.getElementById("advisorGroupModel"));
                }
            })

            var searchModel = {
                searchQuery: ko.observable('')
            };
            searchModel.searchHandle= ko.dependentObservable(function () {
                var code = this.searchQuery().toLowerCase();
                return ko.utils.arrayFilter(advisorGroupModel, function (beer) {
                    debugger;
                    return beer.code.toLowerCase().indexOf(code) >= 0;
                });
                console.log(search);
            }, searchModel)

            ko.applyBindings(searchModel, document.getElementById("searchModel"));
        });

<div id="searchModel">
    <input data-bind="value: searchQuery, valueUpdate: 'keyup'" />
    <h6 data-bind="text: searchQuery"></h6>
</div>
<div class="CheckBoxListGroup" id="advisorGroupModel">
    <ul data-bind="template: { name: 'advisorGroupTemplate', foreach: advisorGroup, as: 'singleAdvisorGroup' }"></ul>
    <script type="text/html" id="advisorGroupTemplate">
        <li>
            <input type="checkbox" data-bind="attr: { value: code, id: code, checked: Chk }" name="GroupsSel">
            <label data-bind="attr: { for: code }, text: '' + code + ' (' + cls + ')' "></label>

        </li>
    </script>
</div>
4

1 回答 1

0

不要将您的显示绑定到整个列表，将您的显示绑定到返回过滤列表或在没有过滤器时返回所有项目的计算函数。

然后在您的 keyup 上调用您的 filterlist 函数，该函数过滤列表，删除与您的过滤器不匹配的列表

于 2013-11-13T06:16:26.390 回答