Knockoutjs удалить несколько, установив флажок

0

У меня есть список "активов", которые я показываю, используя привязку foreach. У каждого актива есть кнопка удаления, которая вызывает $ parent.removeAsset, и все работает нормально.

Однако я хочу добавить опцию, чтобы выбрать несколько "активов", установив флажок, а затем удалите все "активы", которые были отмечены.

Я все еще изучаю веревки нокаутов, поэтому я очень благодарен за любую помощь.

Вот код, который я использую для отображения "активов

<div style="height: 100%; overflow: auto;"  data-bind="foreach: assets">
    <!-- AssetList AssetItem Tmpl BEGIN -->
    <div class="asset-item action" data-tooltip="Select Asset">
        <div class="asset-type" data-bind="css: type">&nbsp;</div>
        <div class="asset-select"><input type="checkbox" /></div>
         <!-- ko if: type() === 'Text' -->
            <div class="asset-name" data-bind="text: content"></div>
         <!-- /ko -->
         <!-- ko if: type() === 'Image' -->
            <div class="asset-name">Image</div> 
         <!-- /ko -->
         <!-- ko if: type() === 'Video' -->
            <div class="asset-name">Video</div> 
         <!-- /ko -->
        <div class="asset-remove-cell">
            <div class="asset-remove action" data-tooltip="Remove Asset" data-bind="click: $parent.removeAsset"></div>
        </div>
    </div>
    <!-- AssetList AssetItem Tmpl END -->
</div>

И это моя функция удаления:

self.removeAsset = function(asset){
    if (!confirm("Are you sure you want to delete this asset?")) {
        event.stopImmediatePropagation();            
        return false;
    }
    self.selectedIndex(0);
    $.ajax({
      url: "/Assets/delete/"+asset.id(),
      type: "POST",
      success: function(response) {
          self.assets.remove(asset);
          //notify('good',response);
      }
    });

};
Теги:
knockout.js

2 ответа

1
Лучший ответ

Как предложил @Kenneth, я добавил логическое значение в мои активы, а затем зациклился на наблюдаемом массиве и удалил каждый актив, для которого установлено значение true. Вот код, который я использовал для тех, кто хочет сделать что-то подобное:

Массив:

function Asset() {
    var self = this;
    self.id         =   ko.observable("");
    self.type       =   ko.observable("");
    self.selected   =   ko.observable(false);
};

Флажок удаления:

<input type="checkbox" data-bind="checked: selected" />

Функция, вызываемая при нажатии кнопки удаления:

$('#deleteMultipleAssets').click(function(){
    if (confirm('Are you sure you want to delete the selected asset?')) {
         ko.utils.arrayForEach(viewModel.assets(), function(asset) {
            if(asset.selected()){
                viewModel.removeMultipleAsset(asset);
            }
        });
    }
});

Функция removeMultipleAssets:

self.removeMultipleAsset = function(asset){
  self.assets.remove(asset);
};
  • 0
    Не забудьте пометить ответ как принятый, таким образом, проблема записывается как решенная SO ...
0

Вы должны добавить поле в свои активы, которое называется selected а затем привязать это поле к флажку, который вы показываете внутри шаблона foreach.

Когда вы нажимаете на общую кнопку удаления, вы можете перебирать свои активы и удалять все те, у которых их selected -field равны true и удаляют их.

  • 0
    Спасибо за предложение. Может быть, у вас есть пример цикла, чтобы найти все активы с выбранным полем, установленным в true?

Ещё вопросы

Сообщество Overcoder
Наверх
Меню