当我们单击网格列(即单击网格列)时,自定义日期排序不起作用

Posted

技术标签:

【中文标题】当我们单击网格列(即单击网格列)时,自定义日期排序不起作用【英文标题】:Customized Date Sorting is not working when we click on grid column i.e on grid column click 【发布时间】:2019-04-15 19:01:05 【问题描述】:

在加入网格时,日期列没有排序,所以我写了sorterFn(),称为自定义排序,它按预期工作。但是当我们在排序更改时单击网格列时,网格日期并没有得到排序。

我已尝试通过查看网格侦听器中的ExtJS Docx [ Ext.grid.header.Container and Ext.grid.Panel] 事件来编写sortChange(),但未调用sortChange() 事件本身。

这是我在加载时编写的示例代码,它按预期工作。

updateGrid: function(filter) 
    me.store.load();
    if(!Ext.isEmpty(me.getStore().sorters))
        me.getStore().sorters.clear();
    

    me.getStore().setSorters([
        sorterProperty: "CALENDAR_DATE",
        direction: "ASC",
        sorterFn: function (date1, date2) 
            var d1, d2;
            if(me.filterDef.mvValues.filter.frequencyFilter == 
                        DCRDashboardConstants.frequency['Daily'])
                d1 = new Date(date1.data.CALENDAR_DATE).getTime();
                d2 = new Date(date2.data.CALENDAR_DATE).getTime();
             else if(me.filterDef.mvValues.filter.frequencyFilter == 
                     DCRDashboardConstants.frequency['Weekly'])
                d1 = new Date(date1.data.CALENDAR_DATE.split('-') 
                      [0]).getTime();
                d2 = new Date(date2.data.CALENDAR_DATE.split('-') 
                      [0]).getTime();
                 else 
                    d1 = date1.data.CALENDAR_DATE;
                    d2 = date2.data.CALENDAR_DATE;
                

                return (d1 > d2) ? 1 : (d1 === d2 ? 0 : -1);
            
    ]);

由于sorterFn: function (date1, date2) 只会被调用一次(在网格加载时),我已经在下面给出的监听器中编写了这段代码,但问题是extjs没有调用偶数本身。

listeners: 
  storeBeforeLoad: function(store) 
  ,
  if(!Ext.isEmpty(me.getStore().sorters))
        me.getStore().sorters.clear();
    

    me.getStore().setSorters([
        sorterProperty: "CALENDAR_DATE",
        direction: "ASC",
        sorterFn: function (date1, date2) 
            var d1, d2;
            if(me.filterDef.mvValues.filter.frequencyFilter == 
                        DCRDashboardConstants.frequency['Daily'])
                d1 = new Date(date1.data.CALENDAR_DATE).getTime();
                d2 = new Date(date2.data.CALENDAR_DATE).getTime();
             else if(me.filterDef.mvValues.filter.frequencyFilter == 
                     DCRDashboardConstants.frequency['Weekly'])
                d1 = new Date(date1.data.CALENDAR_DATE.split('-') 
                      [0]).getTime();
                d2 = new Date(date2.data.CALENDAR_DATE.split('-') 
                      [0]).getTime();
                 else 
                    d1 = date1.data.CALENDAR_DATE;
                    d2 = date2.data.CALENDAR_DATE;
                

                return (d1 > d2) ? 1 : (d1 === d2 ? 0 : -1);
            
    ]);
  

ExtJS 不调用此事件。您能否帮我对网格列的排序更改日期进行排序。

【问题讨论】:

【参考方案1】:

监听器storeBeforeLoad里面没有代码如果你想在store加载的时候加载这个函数你可以试试这个

Ext.create('Ext.data.Store', 
    //rest of configs of your store
    listeners: 
        load: 
            fn: function(store, records, successful, operation, eOpts) 
                //function here
            

        ,
        beforeload: 
            fn: function(store, operation, eOpts) 
                // other function here
            
        
    
)

【讨论】:

是的,你是对的。我可以在加载网格时进行排序。每当我在加载后单击特定列(例如:日期列)时,我都会遇到这个问题,然后我无法对日期列进行排序。原因是 me.getStore().setSorters([ ]) 仅在应用程序启动时被调用,而不是在我们单击特定网格列时调用。所以现在我正在寻找点击该列的排序。请帮我解决这个问题。【参考方案2】:

也许你应该在grid columns 中使用sorter,比如:

sorter: 
    sorterFn: 'sorterMethodName'

文档: https://docs.sencha.com/extjs/6.6.0/classic/Ext.grid.column.Column.html#cfg-sorter

【讨论】:

当然,如果在 6.0.2 中可用,我会试试这个并让你知道。感谢您的帮助:)。

以上是关于当我们单击网格列(即单击网格列)时,自定义日期排序不起作用的主要内容,如果未能解决你的问题,请参考以下文章

如何在单击列标题时对网格视图中的记录进行排序

基于单击列标题在WPF中对数据网格进行排序

在详细单击列标题时编辑剑道网格中的主列标题

如何在单击列标题时对网格视图中的记录进行排序

Extjs4-在加载网格后为列提供默认排序

对 WPF 数据网格中的多列进行排序