Javascript 在EXT js中对渲染/转换的值进行排序

我一直在试着对“总计”列进行排序。不幸的是，它没有这样做

通过研究，我发现渲染值不会排序。有人能给出解决方案吗？我将通过PHP发送数据，因此如果必要，我可以先在那里排序

欢迎任何帮助，包括不成熟的想法

问题专栏：

{
    text: 'Total',
    flex: 1,
    dataIndex: 'sum',
    notDirty: true,
    renderer: function (t, meta, record) {
      var data = record.getData();
      var sum = 0;
      sum += +data.r1 + +data.r2 + +data.r3 + +data.r4 + +data.r5 + +data.r6;
      return sum;
    }
}

您可以使用该函数来进行

将读取器提供的值转换为将存储在模型中的对象的函数

我已经修改了你的代码，它正在工作。你可以在这里查一下

//此函数将计算一些全数字列
函数calculateSum（rec）{
var总和=0；
总和+=+rec.get（'r1'）++rec.get（'r2'）++rec.get（'r3'）++rec.get（'r4'）++rec.get（'r5'）++rec.get（'r6'）；
回报金额；
}
//创建存储
Ext.create（'Ext.data.Store'{
storeId:“demoStore”，
字段：[“团队”、“r1”、“r2”、“r3”、“r4”、“r5”、“r6”{
姓名：'sum'，
转换：功能（v，rec）{
返回计算（rec）；
}
}],
数据：{
“项目”：[{
球队：“布鲁金斯一号”，
r1:'0'，
r2:'0'，
r3:'0'，
r4:'0'，
r5:'6'，
r6:'5'
}, {
团队：“华盛顿1号”，
r1:'0'，
r2:'0'，
r3:'0'，
r4:'0'，
r5:'0'，
r6:'0'
}, {
团队：“苏谷1号”，
r1:'0'，
r2:'0'，
r3:'0'，
r4:'0'，
r5:'0'，
r6:'0'
}]
},
代理：{
键入：“内存”，
读者：{
键入：“json”，
root:'项目'
}
}
});
//公共数字域对象
变量编辑器={
xtype:'numberfield'，
最小值：0，
听众：{
更改：函数（cmp、newValue、oldValue）{
var gridColumn=this.up（），
dataIndex=gridColumn.editingPlugin.activeColumn.dataIndex，
selctedData=gridColumn.up（'grid'）.getSelectionModel（）.getSelection（）[0]；
gridColumn.cellTextValue=newValue；
set（dataIndex，newValue）；
set（'sum'，calculateSum（selctedData））；
}
}
};
//创建网格
Ext.create（'Ext.grid.Panel'{
标题：“总计数排序”，
差额：10，
存储：Ext.data.StoreManager.lookup（'demoStore'），
插件：Ext.create（'Ext.grid.plugin.CellEditing'{
单击编辑：1
}),
栏目：[{
文本：“团队”，
数据索引：“团队”，
}, {
正文：“第1轮”，
弹性：1，
数据索引：“r1”，
编辑：编辑
}, {
正文：“第二轮”，
弹性：1，
数据索引：“r2”，
编辑：编辑
}, {
正文：“第三轮”，
弹性：1，
数据索引：“r3”，
编辑：编辑
}, {
正文：“第四轮”，
弹性：1，
数据索引：“r4”，
编辑：编辑
}, {
正文：“第5轮”，
弹性：1，
数据索引：“r5”，
编辑：编辑
}, {
正文：“第6轮”，
弹性：1，
数据索引：“r6”，
编辑：编辑
}, {
正文：“总计”，
弹性：1，
数据索引：“总和”，
没错，
/*渲染器：函数（t、元、记录）{
var data=record.getData（）；
var总和=0；
sum+=+data.r1++data.r2++data.r3++data.r4++data.r5++data.r6；
回报金额；
}*/
}],
摘要：[{
xtype:'工具栏'，
项目：[{
xtype:'按钮'，
文本：“保存并计算”，
处理程序：函数（btn）{
/*var store=btn.up（'grid'）.getStore（）；
对于（i=0；itext:'你解决了吗？你的代码根本没有排序功能。谢谢！Sencha fiddle不喜欢用户定义的函数吗？
//this function will calculate some all numeric columns
function calculateSum(rec) {
    var sum = 0;
    sum += +rec.get('r1') + +rec.get('r2') + +rec.get('r3') + +rec.get('r4') + +rec.get('r5') + +rec.get('r6');
    return sum;
}
//Create store
Ext.create('Ext.data.Store', {
    storeId: 'demoStore',
    fields: ['team', 'r1', 'r2', 'r3', 'r4', 'r5', 'r6', {
        name: 'sum',
        convert: function (v, rec) {
            return calculateSum(rec);
        }
    }],
    data: {
        'items': [{
            team: 'Brookings 1',
            r1: '0',
            r2: '0',
            r3: '0',
            r4: '0',
            r5: '6',
            r6: '5'
        }, {
            team: 'Washington 1',
            r1: '0',
            r2: '0',
            r3: '0',
            r4: '0',
            r5: '0',
            r6: '0'
        }, {
            team: 'Sioux Valley 1',
            r1: '0',
            r2: '0',
            r3: '0',
            r4: '0',
            r5: '0',
            r6: '0'
        }]
    },
    proxy: {
        type: 'memory',
        reader: {
            type: 'json',
            root: 'items'
        }
    }
});
//Common numberfield object
var editor = {
    xtype: 'numberfield',
    minValue: 0,
    listeners: {
        change: function (cmp, newValue, oldValue) {
            var gridColumn = this.up(),
                dataIndex = gridColumn.editingPlugin.activeColumn.dataIndex,
                selctedData = gridColumn.up('grid').getSelectionModel().getSelection()[0];
            gridColumn.cellTextValue = newValue;
            selctedData.set(dataIndex, newValue);
            selctedData.set('sum', calculateSum(selctedData));
        }
    }
};

//Create Grid
Ext.create('Ext.grid.Panel', {
    title: 'Total count sorting',
    margin: 10,
    store: Ext.data.StoreManager.lookup('demoStore'),
    plugins: Ext.create('Ext.grid.plugin.CellEditing', {
        clicksToEdit: 1
    }),
    columns: [{
        text: 'Team',
        dataIndex: 'team',
    }, {
        text: 'Round 1',
        flex: 1,
        dataIndex: 'r1',
        editor: editor
    }, {
        text: 'Round 2',
        flex: 1,
        dataIndex: 'r2',
        editor: editor
    }, {
        text: 'Round 3',
        flex: 1,
        dataIndex: 'r3',
        editor: editor
    }, {
        text: 'Round 4',
        flex: 1,
        dataIndex: 'r4',
        editor: editor
    }, {
        text: 'Round 5',
        flex: 1,
        dataIndex: 'r5',
        editor: editor
    }, {
        text: 'Round 6',
        flex: 1,
        dataIndex: 'r6',
        editor: editor
    }, {
        text: 'Total',
        flex: 1,
        dataIndex: 'sum',
        notDirty: true,
        /* renderer: function (t, meta, record) {
             var data = record.getData();
             var sum = 0;
             sum += +data.r1 + +data.r2 + +data.r3 + +data.r4 + +data.r5 + +data.r6;
             return sum;
         }*/
    }],
    dockedItems: [{
        xtype: 'toolbar',
        items: [{
            xtype: 'button',
            text: 'Save and Calculate',
            handler: function (btn) {
                /* var store = btn.up('grid').getStore();
                 for (i = 0; i < store.getModifiedRecords().length; i++) {
                     console.log(i + ":");
                     console.log(store.getModifiedRecords()[i]['data']);
                     postVals(store.getModifiedRecords()[i]['data']); // @TODO_DEVELOPER loop this!
                 }*/
            }
        }, {
            xtype: "label",
            text: "|"
        }, {
            xtype: 'button',
            text: 'Refresh Table',
            handler: function () {
                //refresh();
            }
        }, {
            xtype: 'label',
            text: '<-- Click there to update the totals.'
        }]
    }],
    height: 200,
    renderTo: Ext.getBody()
});