1. Home
  2. Forum
  3. Vue
  4. Bug in column sort comparer

Bug in column sort comparer

In the source code file webpack:///./node_modules/@syncfusion/ej2-grids/src/grid/models/column.js, the Column constructor has the following code:

        if (this.sortComparer) {
            var a_1 = this.sortComparer;
            this.sortComparer = function comparer(x, y, xObj, yObj) {
                if (typeof a_1 === 'string') {
                    a_1 = getObject(a_1, window);
                }
                if (this.sortDirection === 'Descending') {
                    var z = x;
                    x = y;
                    y = z;
                    var obj = xObj;
                    xObj = yObj;
                    yObj = obj;
                }
                return a_1(x, y, xObj, yObj);
            };
        }

Note that inside the comparer function, it references 'this', but there is no scope. Doesn't it need to use the hoisted variable '_this'? With a grid containing a column configuring a custom sortComparer, an error is thrown when printing the grid:

column.js?3b5d:225 Uncaught TypeError: Cannot read properties of undefined (reading 'sortDirection')
    at comparer (column.js?3b5d:225:1)
    at Column.comparer [as sortComparer] (column.js?3b5d:233:1)
    at Function.DataUtil.merge (util.js?d77f:355:1)
    at Function.DataUtil.sort (util.js?d77f:339:1)
    at Function.DataUtil.sort (util.js?d77f:337:1)
    at Function.DataUtil.sort (util.js?d77f:337:1)
    at Function.DataUtil.sort (util.js?d77f:337:1)
    at JsonAdaptor.onSortBy (adaptors.js?0f5f:305:1)
    at JsonAdaptor.processQuery (adaptors.js?0f5f:109:1)
    at DataManager.executeLocal (manager.js?4f3e:122:1)





22 Replies
BN Bill Naples February 16, 2022 12:25 AM UTC

I think what's happening is that when printing this.sortComparer gets double wrapped, i.e., was set once during initial render of html grid, only for columns that have a custom sortComparer. Then during printing it gets wrapped again.


BN Bill Naples February 16, 2022 01:17 AM UTC

The following patch fixes this bug:

// Patch the following bug: https://www.syncfusion.com/forums/172908/bug-in-column-sort-comparer
// It needs to patch both grid render and updateColumnObject, because they both call prepareColumns().
function patchSortComparers (gridFunc, args) {
const oldColumns = [...this.columns]
const columnSortComparers = this.columns
.map(col => !(col instanceof Column) ? col.sortComparer : null)
gridFunc.apply(this, args)
const newColumns = this.columns
columnSortComparers.forEach((columnSortComparer, index) => {
if (!columnSortComparer) return
const column = newColumns[index]

const _this = column
let a_1 = columnSortComparer
column.sortComparer = function comparer(x, y, xObj, yObj) {
if (typeof columnSortComparer === 'string') {
// Not exactly like SyncFusion's getObject function, but hopefully good enough.
a_1 = _.get(window, a_1)
}
if (_this.sortDirection === 'Descending') {
var z = x
x = y
y = z
var obj = xObj
xObj = yObj
yObj = obj
}
return a_1(x, y, xObj, yObj)
}
// Because of the way Sync Fusion merges the column object into the original column configuration,
// we need to patch the original column configuration too.
oldColumns[index].sortComparer = columnSortComparer
})
}

const gridRender = Grid.prototype.render
Grid.prototype.render = function () {
patchSortComparers.call(this, gridRender, arguments)
}

const gridUpdateColumnObject = Grid.prototype.updateColumnObject
Grid.prototype.updateColumnObject = function () {
patchSortComparers.call(this, gridUpdateColumnObject, arguments)
}

VN Vignesh Natarajan Syncfusion Team February 16, 2022 04:25 PM UTC

Hi Bill, 

Thanks for contacting Syncfusion support.  

From your query we understand that you have resolved your query on your own. We are glad to hear that.  

Please get back to us if you need any further assistance from us.     

Regards, 
Vignesh Natarajan

BN Bill Naples February 16, 2022 09:29 PM UTC

Hi Vignesh, I did a monkey patch for the bug. Are you going to fix it?


RS Rajapandiyan Settu Syncfusion Team February 17, 2022 04:18 PM UTC

Hi Bill, 

Sorry for the inconvenience caused. 

Before proceeding with your query, we need more information on your requirement. So, kindly share the below details to validate further on this. 

  1. Share the complete code you have used.
  2. Share the package.json file.
  3. Share the video demo of the reported behavior.
  4. If possible share the issue reproducible sample which will be very helpful for us.

Regards, 
Rajapandiyan S 


BN Bill Naples February 18, 2022 01:11 AM UTC

Hi Rajapandiyan,


Please see attached zip sample. When clicking Print, the error occurs:


column.js?a57a:225 Uncaught TypeError: Cannot read properties of undefined (reading 'sortDirection')
    at comparer (column.js?a57a:225:1)
    at Column.comparer [as sortComparer] (column.js?a57a:233:1)
    at Function.DataUtil.merge (util.js?7b35:355:1)
    at Function.DataUtil.sort (util.js?7b35:339:1)
    at Function.DataUtil.sort (util.js?7b35:337:1)
    at JsonAdaptor.onSortBy (adaptors.js?aad1:305:24)
    at JsonAdaptor.processQuery (adaptors.js?aad1:109:1)
    at DataManager.executeLocal (manager.js?2378:122:1)
    at eval (manager.js?2378:181:1)
    at run (setImmediate.js?9b2a:43:1)

Attachment: SyncFusion_19.4_Grid_Sort_Comparer_809935c9.zip

JC Joseph Christ Nithin Issack Syncfusion Team February 18, 2022 04:03 PM UTC

Hi Bill, 

  Thanks for your update. 

  We have validated your query and we have confirmed it as a bug and logged the defect report “Print not working when sortComparer property set to a column” for the same. Thank you for taking the time to report this issue and helping us improve our product. At Syncfusion, we are committed to fixing all validated defects (subject to technological feasibility and Product Development Life Cycle) and including the defect fix in our weekly release which is expected to be rolled out by the March 2nd  , 2022.   
            
You can now track the current status of your request, review the proposed resolution timeline, and contact us for any further inquiries through this link.      


Regards,  
Joseph I. 


BN Bill Naples February 18, 2022 10:27 PM UTC

Thank you Joseph.


VN Vignesh Natarajan Syncfusion Team February 21, 2022 10:38 AM UTC

Hi Bill, 

Thanks for your update. 

You are welcome, We will update on this once the release is rolled out. 

Regards, 
Vignesh Natarajan 


JC Joseph Christ Nithin Issack Syncfusion Team March 3, 2022 05:15 AM UTC

Hi Bill, 

  Thanks for your patience. 

  We are glad to announce that our Essential Javascript2 patch release (v19.4.54) has been rolled out successfully and in that release, we have added the fix for the issue - “Print not working when sortComparer property set to a column”. So please update your packages to this version to include the fix. 

 

  We thank you for your support and appreciate your patience in waiting for this release. Please get in touch with us if you would require any further assistance. 


Regards, 
Joseph I. 


BN Bill Naples March 3, 2022 08:35 PM UTC

Hi Joseph,


The error is gone, but it won't print in descending order. See attached project sample. It sorts name in descending order, and displays correct in html. But when printing, it's in ascending order. Thanks.


Attachment: SyncFusion_19.4_Grid_Print_Sort_62f5709f.zip

BN Bill Naples March 3, 2022 08:36 PM UTC

Correction: Please use the project sample attached to this message, and ignore the one in my last message.


Attachment: SyncFusion_19.4_Grid_Print_Sort_9f49df03.zip

JC Joseph Christ Nithin Issack Syncfusion Team March 4, 2022 11:39 AM UTC

Hi Bill, 

   Thanks for your update. 

   We have run the sample provided in your update and tried to reproduce the issue by printing, but we were not able to reproduce the reported issue. We have attached the video demonstration for your reference.  


  We suspect that the issue may be reproduced in your side due to duplicate packages while you tried to update the syncfusion package. Please follow the below steps to overcome this issue. 

  • Delete the package.lock.json file from your application.
  • Remove the @syncfusion folder in the node_modules folder of your project.
  • Use the latest version (or use *)for all the Syncfusion components in the package.json file.
  • Then execute npm install command.

Please get back to us if you still face the issue. 

Regards, 
Joseph I. 


BN Bill Naples March 4, 2022 06:13 PM UTC

Hi, the video you sent doesn't shown descending order. It shows ascending order. The bug is that when you sort the html in descending order, the print version is not in descending order.


JC Joseph Christ Nithin Issack Syncfusion Team March 7, 2022 03:40 PM UTC

Hi Bill, 

  Thanks for your update. 

   We were able to reproduce the reported issue from our side. We are validating the issue in the source side. We will provide further details on or before 9th march 2022. We appreciate your patience until then. 

Regards, 
Joseph I. 


JC Joseph Christ Nithin Issack Syncfusion Team March 9, 2022 08:38 AM UTC

Hi Bill, 

  Thanks for your patience. 

  We have validated your query and we have confirmed it as a bug and logged the defect report “Grid not printing in descending when sorting is descending and sortComparer property set to a column” for the same. Thank you for taking the time to report this issue and helping us improve our product. At Syncfusion, we are committed to fixing all validated defects (subject to technological feasibility and Product Development Life Cycle) and including the defect fix in our weekly release which is expected to be rolled out by the March 23rd, 2022.   
            
You can now track the current status of your request, review the proposed resolution timeline, and contact us for any further inquiries through this link.      


Regards,  
Joseph I. 


BN Bill Naples March 9, 2022 03:17 PM UTC

Thanks very much Joseph.


RR Rajapandi Ravi Syncfusion Team March 10, 2022 04:10 PM UTC

Hi Bill, 

Thankyou. Currently we are working on it, and we will update you details as we promised. 

Regards, 
Rajapandi R 


JC Joseph Christ Nithin Issack Syncfusion Team March 24, 2022 01:59 PM UTC

Sorry for the inconvenience caused. 

   Due to some complexities involved in this issue, we were not able to include the fix for the issue “Grid not printing in descending when sorting is descending and sortComparer property set to a column” as promised. We are currently working on it with high priority and will include it in our patch release scheduled to be rolled out by Mid of April 2022. We appreciate your patience until then. 


BN Bill Naples March 24, 2022 06:09 PM UTC

Ok, thanks for the update Joseph.


JC Joseph Christ Nithin Issack Syncfusion Team March 25, 2022 08:07 AM UTC

You are welcome, We will update on this once the release is rolled out. 


JC Joseph Christ Nithin Issack Syncfusion Team May 7, 2022 02:10 AM UTC

Hi Bill,


  Sorry for the late reply.


  We have come up with a custom solution for the issue ‘Grid not printing in descending when sorting is descending and sortComparer property set to a column’ by overwriting the grid print function. In this function, change the column’s 'sortCompare' function by assigning the user defined 'sortComparerFunction' function. So that we can print the grid in descending order. And reassigning the previous 'sortCompare' function so that we can sort the grid.


Please refer the below code example.


 

print() {

      var grid = this.$refs.grid.ej2Instances;

      var sortFun = grid.columnModel[0].sortComparer;

      grid.columnModel[0].sortComparer = this.sortComparerFunction;

      if (grid.printModule) {

          grid.printModule.print();

      }

      grid.columnModel[0].sortComparer = sortFun;

    },

    sortComparerFunction: function(reference, comparer, referenceObj, comparerObj) {

      if (reference < comparer) return -1

      else if (reference > comparer) return 1

      return 0

    },

 


Sample: https://www.syncfusion.com/downloads/support/directtrac/general/ze/SYNCFU~1-778936367


Please get back to us for further details.


Regards,

Joseph I.


Loader.
Up arrow icon