İçindekilerle özel sütunları sırala özel js

Question

Bazı özel sütunlarla birlikte bir kılavuzum var ve bu sütunu sıralamak istiyorum - bunun içinde görüntülenenlere göre sıralamak istiyorum, ama gerçekten yapamıyorum dataIndex temelli olmayan bir sütun için bir sıralayıcının nasıl tanımlanacağını anla - özel bir model kullanmayı denedim, ancak bunu işe alamadım.

Answer 1

Sütunun doSort yöntemini geçersiz kılabilirsiniz. İşte onun özü. Ayrıca çalışan bir keman oluşturdum (http://jsfiddle.net/cfarmerga/LG5uA/). Keman, bir alanın dize uzunluğunu sıralama özelliği olarak kullanır, ancak elbette kendi özel sıralama mantığınızı uygulayabilirsiniz.

var grid = Ext.create('Ext.grid.Panel',{ 
    //... 
    columns: [ 
     { text: 'name', dataIndex: 'name', sortable: true }, 
     { 
      text: 'Custom', 
      sortable : true, 
      dataIndex: 'customsort', 
      doSort: function(state) { 
       var ds = this.up('grid').getStore(); 
       var field = this.getSortParam(); 
       ds.sort({ 
        property: field, 
        direction: state, 
        sorterFn: function(v1, v2){ 
         v1 = v1.get(field); 
         v2 = v2.get(field); 
         return v1.length > v2.length ? 1 : (v1.length < v2.length ? -1 : 0); 
        } 
       }); 
      } 
     } 
    ] 
    //.... 
}); 

Answer 2

Kullanıldığı ediliyor önce verileri dönüştürmek için izin verir Ext.data.Model sınıfı bir dönüştürmek yöntemi yoktur. Ardından, sütundaki bu 'dataIndex' değerini belirtebilir ve normal bir sıralama yapabilirsiniz. Sütun, dönüştürülen değerle sıralanır. Aşağıda örnek bir sadece bir alan (Ana) model ve dönüşüm gelen oluyor ile geçerli:

Ext.define('MyModel', { 
    extend: 'Ext.data.Model', 
    fields: [ 
     {name: 'Parent', type: 'string', convert: sortParent}, 
     // other fields... 
    ], 
    sortParent: function(value, record) { 
     var ret = record.raw.Parent; 
     if (ret) { 
      return ret.Name; 
     } else { 
      meta.tdCls = 'invisible'; 
      return record.data.Name; 
     } 
    } 
}); 

Answer 3

Ext JS sürümü 5 için, doSort çıkarıldı, bu yüzden bunu geçersiz olamazdı gibi görünüyor. Bunun yerine, sortchange olayını dinleme yoluna gittim ve oradan Ext.data.Store.setSorters yöntemini kullandım. ne bu çözümlerin benim durumumda çalıştı nedeni çünkü ben olduğunu düşünüyorum

// grid class 
initComponent: function() { 
    ... 
    this.on('sortchange', this.onSortChange, this); 
}, 

onSortChange: function(container, column, direction, eOpts) { 
    // check for dayColumnIndex 
    if (column && column.dayColumnIndex !== undefined) { 
    this.sortColumnByIndex(column.dayColumnIndex, direction); 
    } 
}, 

sortColumnByIndex: function(columnIndex, direction) { 
    var store = this.getStore(); 
    if (store) { 
    var sorterFn = function(rec1, rec2) { 
     var sortValue = false; 
     if (rec1 && rec2) { 
     var day1; 
     var daysStore1 = rec1.getDaysStore(); 
     if (daysStore1) { 
      day1 = daysStore1.getAt(columnIndex); 
     } 
     var day2; 
     var daysStore2 = rec2.getDaysStore(); 
     if (daysStore2) { 
      day2 = daysStore2.getAt(columnIndex); 
     } 
     if (day1 && day2) { 
      var val1 = day1.get('value'); 
      var val2 = day2.get('value'); 
      sortValue = val1 > val2 ? 1 : val1 === val2 ? 0 : -1; 
     } 
     } 
     return sortValue; 
    }; 
    if (direction !== 'ASC') { 
     sorterFn = function(rec1, rec2) { 
     var sortValue = false; 
     if (rec1 && rec2) { 
      var day1; 
      var daysStore1 = rec1.getDaysStore(); 
      if (daysStore1) { 
      day1 = daysStore1.getAt(columnIndex); 
      } 
      var day2; 
      var daysStore2 = rec2.getDaysStore(); 
      if (daysStore2) { 
      day2 = daysStore2.getAt(columnIndex); 
      } 
      if (day1 && day2) { 
      var val1 = day1.get('value'); 
      var val2 = day2.get('value'); 
      sortValue = val1 < val2 ? 1 : val1 === val2 ? 0 : -1; 
      } 
     } 
     return sortValue; 
     }; 
    } 
    store.setSorters([{ 
     sorterFn: sorterFn 
    }]); 
    } 
}