Обновить Knockout ViewModel с помощью Ajax в ASP.NET MVC

Question

У меня есть таблица, которая содержит начальные значения. Пользователь может фильтровать данные в таблицах, и таблица должна обновляться. Я не могу сделать это с нокаутом.

Вид:

<tbody id="tblMultiEdit" data-bind="foreach: UUTs">
   <tr>
     <td data-bind="text: SerialNumber"></td>
     <td><input type="checkbox" data-bind="checked: (ReqDowngrade == 'Y' ? 1 : 0)" /></td>
  </tr>
</tbody>

Просмотр модели:

function ViewModel(UUTs) {

   var self = this;
   self.UUTs = UUTs;
};

Начальная привязка:

var viewModel = new ViewModel(@Html.HtmlConvertToJson(Model));
ko.applyBindings(viewModel);

Ajax Вызов для получения новых значений таблицы:

function search() {
            $("#btnSearch").click(
                function () {
                    $('#image').hide()
                    $.ajax({
                        type: 'GET',
                        url: "@Url.Action("search", "UUTs")",
                        dataType: 'json',
                        data:
                            {
                                lab: $("#drpLab").val()
                            },
                        success: function (data) {

                            var viewModel = new ViewModel(data);    
                            ko.applyBindings(viewModel);

                        }, error: function (ex) {
                            toastr.error('Failed to retrieve search results, please check your network connection.' + ex)
                        }
                    })
                }
                )
        }

Отладка Я вижу данные JSON о методе успеха вызова Ajax. Что мне нужно сделать, чтобы обновить данные?

Answer 1

Сначала объявите проверяемое оборудование как массив observableArray, а затем обновите его по своему усмотрению. Вы должны обновить наблюдаемый массив, к которому вы привязываетесь, вместо того, чтобы повторно объявлять его.

function ViewModel(UUTs) {

   var self = this;
   self.UUTs = ko.observableArray(UUTs);
};

Итак, в вашем обратном вызове ajax вы должны сделать что-то вроде этого:

    success: function (data) {
                                viewModel.UUTs(data); 
// assuming data is an array. otherwise some mapping my be needed
// reference to the same model, no new viewModel needed  
                            }