0

次の関数を使用して、sort と呼ばれる整数値に基づいて observableArray をソートしています。

model.sortColumns = function (a, b) {
  return a.Order > b.Order ? 1 : -1;
};

model.sortedColumns = ko.dependentObservable(function () {
  return this.reportFields.slice().sort(this.sortColumns);
}, model);

私は foreach を使用してそれらを画面に表示していますが、すべてうまく機能していますが、今必要なのは foreach で順序を変更する機能を提供することです。クリックイベント付きのシンプルな上下矢印アイコンを配置するつもりでしたが、変更方法がわかりません。以前にこのようなことをした人はいますか?

4

1 に答える 1

3

並べ替えと順序付けに関するすばらしい記事は次のとおりです: http://www.knockmeout.net/2011/05/dragging-dropping-and-sorting-with.html

この記事では、すべての魔法はカスタム バインディングを使用して行われます。

  ko.bindingHandlers.sortableList = {
      init: function(element, valueAccessor) {
          var list = valueAccessor();
          $(element).sortable({
              update: function(event, ui) {
                  //retrieve our actual data item
                  var item = ui.item.tmplItem().data;
                  //figure out its new position
                  var position = ko.utils.arrayIndexOf(ui.item.parent().children(), ui.item[0]);
                  //remove the item and add it back in the right spot
                  if (position >= 0) {
                      list.remove(item);
                      list.splice(position, 0, item);
                  }
              }
          });
      }
  };

<div data-bind="foreach: sortedColumns, sortableList: sortedColumns"></div>
于 2012-11-05T11:11:08.497 に答える