Остановить событие sibling in Knockout

Question

Существует таблица, в которой сортировка применяется в заголовке на разных столбцах.

В случае, когда выполняется сортировка одного столбца/процесс, и в то же время пользователь сортирует сортировку другого столбца. Это не ведет себя с правильным замыканием.

<div class="table-col"> 
    Title 
    <a href="#" class="image_rght" data-bind="click: function(data,event){app.viewModel.sort('Title')},css:{noclass: app.viewModel.sortBy()=='' && app.viewModel.sortDirection(),toggleup:app.viewModel.sortBy()=='Title'&& app.viewModel.sortDirection(),toggledown:app.viewModel.sortBy()=='Title'&& !app.viewModel.sortDirection()}"><img src="~/Content/images/up_down_arrow.png" /></a> 
</div> 
<div class="table-col"> 
    Date 
    <a href="#" class="image_rght" data-bind="click: function(data,event){app.viewModel.sort('StartDate')}, css:{toggleup:app.viewModel.sortBy()=='StartDate'&& app.viewModel.sortDirection(),toggledown:app.viewModel.sortBy()=='StartDate'&& !app.viewModel.sortDirection()}"><img src="/Content/images/up_down_arrow.png" /></a> 
</div> 
<div class="table-col"> 
    Facility 
    <a href="#" class="image_rght" data-bind="click: function(data,event){app.viewModel.sort('FacilityName')}, css:{toggleup:app.viewModel.sortBy()=='FacilityName'&& app.viewModel.sortDirection(),toggledown:app.viewModel.sortBy()=='FacilityName'&& !app.viewModel.sortDirection()}"><img src="/Content/images/up_down_arrow.png" /></a> 
</div> 

Так что я хочу остановиться, другое событие сортировки, когда выполняется другой процесс.

Пример: Пользователь нажал на Заголовок для сортировки, поскольку это процесс не завершен и то же время пользователь нажал на Дата колонке, то событие дата столбец не должен быть огонь до Заголовок сортировка не завершена.

Answer 1

У вас на вашем пути много логики, что обычно усложняет ситуацию. Начните с добавления обработчика кликов в свою модель просмотра. Создайте наблюдаемый isSorting, который вы можете использовать, чтобы проверить, нужно ли отложить обновление.

В это самая основная форма:

var self = this; 

self.sort = ko.observable("Title"); 
self.isSorting = ko.observable(false); 

self.onClick = function(sortBy) { 
    if (self.isSorting()) { 
    // Queue logic 
    } else { 
    self.sort(sortBy); 
    } 
}; 

я предлагаю использовать вспомогательный метод для создания обработчиков событий, присоединенные к различным категориям. Например:

self.sortHandlerFor = function(sortBy) { 
    return self.onClick.bind(self, sortBy); 
}; 

Что вы можете использовать так:

<a data-bind="click: sortHandlerFor('Title')"></a> 
<a data-bind="click: sortHandlerFor('StartDate')"></a> 

Вы можете использовать ту же самую идею об активном/пассивном состоянии логики: создать фабричный метод, который возвращает вычисленный true или false через viewmodel вместо представления.

Очередь логики для ваших заданий sort тесно связана с вашим асинхронным кодом. Если вам нужна помощь в этом, я предлагаю вам отредактировать свой вопрос, чтобы добавить эту часть приложения.