如何禁用ExtJS中的特定行上的排序

Question

我有一个ExtJs网格，其中我不想排序第一行。如何忽略ExtJS分拣机？

sortchange(ct, column, direction, eOpts){ 
     console.log(column, ct); 
    }, 

我们可以用sortchange听众吗？

Answer 1

您所能做的就是编写特殊的分拣机，始终保持第一行。自定义分拣机功能的示例可以在here中找到。

在你的情况，你可以使用一个特殊的布尔场“keepOnTop”和分拣机：

sorterFn: function(a, b) { 
    // Special sorting for first line: 
    if(a.get('keepOnTop')) return 1; 
    if(b.get('keepOnTop')) return -1; 
    // Usual sorting; example with "department" index: 
    if(a.get('department') < b.get('department')) return 1; 
    if(a.get('department') > b.get('department')) return -1; 
    return 0; 
}, 

（请注意，这分拣机预计只有一行有keepOnTop设置为true）

Answer 2

检查这个 http://docs.sencha.com/extjs/4.2.2/#!/api/Ext.grid.column.Column-cfg-sortable

这里例如...

Ext.create('Ext.grid.Panel', { 
 
    title: 'Simpsons', 
 
    store: Ext.data.StoreManager.lookup('simpsonsStore'), 
 
    columns: [ 
 
     { text: 'Nombre', dataIndex: 'name', sortable: false }, 
 
     { text: 'Email', dataIndex: 'email', sortable: false }, 
 
     { text: 'Phone', dataIndex: 'phone' } 
 
    ], 
 
    height: 200, 
 
    width: 400, 
 
    renderTo: Ext.getBody() 
 
});

Answer 3

在ExtJs的文档提供方法来禁止使用排序有方法来加载数据排序列。 You can refer ExtJs docs

我已经创建了一个小演示来展示你，它是如何工作的。 Sencha fiddle example

Ext.create('Ext.data.Store', { 
    storeId: 'employeeStore', 
    fields: ['firstname', 'lastname', 'seniority', 'dep', 'hired'], 
    data: [{ 
     firstname: "Michael", 
     lastname: "Scott", 
     seniority: 7, 
     dep: "Management", 
     hired: "01/10/2004" 
    }, { 
     firstname: "Dwight", 
     lastname: "Schrute", 
     seniority: 2, 
     dep: "Sales", 
     hired: "04/01/2004" 
    }, { 
     firstname: "Jim", 
     lastname: "Halpert", 
     seniority: 3, 
     dep: "Sales", 
     hired: "02/22/2006" 
    }, { 
     firstname: "Kevin", 
     lastname: "Malone", 
     seniority: 4, 
     dep: "Accounting", 
     hired: "06/10/2007" 
    }, { 
     firstname: "Angela", 
     lastname: "Martin", 
     seniority: 5, 
     dep: "Accounting", 
     hired: "10/21/2008" 
    }] 
}); 

Ext.create('Ext.grid.Panel', { 
    title: 'Column Demo', 
    store: Ext.data.StoreManager.lookup('employeeStore'), 
    columns: [{ 
     text: 'First Name', 
     dataIndex: 'firstname', 
     sortable: false 
    }, { 
     text: 'Last Name', 
     dataIndex: 'lastname' 
    }, { 
     text: 'Hired Month', 
     dataIndex: 'hired', 
     xtype: 'datecolumn', 
     format: 'M', 
     sortable: false 
    }, { 
     text: 'Department (Yrs)', 
     xtype: 'templatecolumn', 
     tpl: '{dep} ({seniority})' 
    }], 
    width: 400, 
    forceFit: true, 
    renderTo: Ext.getBody() 
});