2013-04-29 3 views
0

У меня есть нокаут привязки на стол с колонками. Я пытался добиться сортировки таблиц для каждого столбца. мнение выглядит следующим образом:таблица сортировки с использованием шаблона

<table id="notes" class="notes_table"> 
          <tr class="head"> 
           <th data-bind='click: function() { SortItems("CreatedDate")}'> 
            <span>Date</span> 
           </th> 
           <th data-bind='click: function() { SortItems("Type")}'> 
            <span>Type</span> 
           </th> 
           <th data-bind='click: function() { SortItems("Category")}'> 
            <span>Category</span> 
           </th> 
           <th data-bind='click: function() {SortItems("AddedBy")}'> 
            <span>Added by</span> 
           </th> 
          </tr> 
          <tbody data-bind="template: { name: 'StudentNote', foreach: notes }"></tbody> 
         </table> 
         <script type="text/html" id="StudentNote"> 
          <tr class="even"> 
           <td><span data-bind="text: CreatedDate"></span></td> 
           <td><span data-bind="text: Type"></span></td> 
           <td><span data-bind="text: Category"></span></td> 
           <td><span data-bind="text: AddedBy"></span></td> 
          </tr> 
         </script> 

и Javascript, как:

function notesViewModel() { 
    var _this = {}; 
    _this.colName = "CreatedDate"; 
    _this.sortOrder = "desc"; 
    _this.notes = ko.observableArray(); 
_this.SortItems = function (ColumnName) { 

     var newNotes = _this.notes(); 
     if (_this.sortOrder === "desc") { 
      this.notes(newNotes.sort(notesViewModel._getSortFunction = function (a, b) { 
       _this.sortOrder = "asc"; 
       return a[ColumnName] < b[ColumnName] ? -1 : 1; 
      })); 

     } else { 
      this.notes(newNotes.sort(notesViewModel._getSortFunction = function (a, b) { 
       _this.sortOrder = "desc"; 
       return a[ColumnName] > b[ColumnName] ? -1 : 1; 
      })); 
     } 
    }; 
ko.applyBindings(_this, $("body").get(0)); 
return _this; 

Даже если это сортировка, он просто переключает между восходящей и нисходящей сортировки по каждому из колонки, но не распознает, какой колонка это сортировка .. Как сделать сортировку по каждой колонке ..

ответ

1

Попробуйте это:

function notesViewModel() { 
    var _this = {}; 
    _this.colName = "CreatedDate"; 
    _this.sortOrder = 1; 
    _this.notes = ko.observableArray(); 
    _this.SortItems = function (ColumnName) { 
     if(ColumnName == _this.colName) 
      _this.sortOrder = _this.sortOrder * -1; 
     else 
      _this.colName = ColumnName; 

     _this.notes.sort(function (a, b) { 
      return (a[ColumnName] < b[ColumnName] ? -1 : 1) * _this.sortOrder; 
     }); 
    }; 
    ko.applyBindings(_this, $("body").get(0)); 
    return _this; 
} 
+0

спасибо, возможно, за ответ .. но, если я нажму на один столбец и отсортирую их по возрастанию и нажимаю на другое, он сортирует позже как нисходящий (означает переключение между восходящим и нисходящим независимо от столбца). Я ожидаю увидеть восходящий по второй колонке aswell – user2288976

+0

Я скорректировал код, чтобы сохранить порядок сортировки при изменении столбцов. – RodneyTrotter

+0

новый код не делает сортировку по убыванию .. – user2288976

Смежные вопросы