使用模板排序表

Question

我有表與列的敲除綁定。我試圖爲每列實現表格分類。 的看法是這樣的：

<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; 

即使它的排序，它只是升序和降序之間切換在每個列的，但不能識別哪些列被排序。如何做每一列排序..

Answer 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; 
}