"allowSorting" undefined when sorting sorting by certain column

[Matthew George]

I'm getting an undefined error for "allowSorting" when sorting by Date Modified. All the other sorts work and even Date Modified does sort but doesn't trigger when selecting Date Modified in the dropdown and instead when selecting an order option after clicking Date Modified the Date Modified gets selected in the dropdown and the list is sorted properly. "allowSorting" error doesn't show with any other column and shows when Date Modified is clicked and when a sort order is clicked after Date Modified.

app.component.ts file manager settings:

`this.toolbarSettings = { items: ['NewFolder', 'Upload', 'Cut', 'Copy', 'Paste', 'Delete', 'Rename', 'SortBy', 'Refresh', 'Selection', 'View', 'Details'], visible: true };

    this.uploadSettings = { autoUpload: true, minFileSize: 0, maxFileSize: 2000000000, allowedExtensions: '', autoClose: false };

    this.contextMenuSettings = { file: ['Open', '|', 'Cut', 'Copy', '|', 'Delete', 'Rename', '|', 'Details'], folder: ['Open', '|', 'Cut', 'Copy', 'Paste', '|', 'Delete', 'Rename', '|', 'Details'], layout: ['SortBy', 'View', 'Refresh', '|', 'Paste', '|', 'NewFolder', 'Upload', '|', 'Details', '|', 'SelectAll'], visible: true, };

    this.navigationPaneSettings = { maxWidth: '650px', minWidth: '240px', visible: true, };

    this.detailsViewSettings = {

      columns: [

        { field: 'name', headerText: 'Name', minWidth: 120, width: '200', template: '${name}', customAttributes: { class: 'e-fe-grid-name' } },

        { field: 'previousName', headerText: 'Original Name', minWidth: 50, width: '190' },

        { field: 'action', headerText: 'Type', minWidth: 50, width: '190' },

        { field: 'newName', headerText: 'User', minWidth: 120, width: '120' },

        { field: 'dateModified', headerText: 'Date Modified', type: 'dateTime', format: 'MMMM dd, yyyy hh:mm a', minWidth: 120, width: '190' },

        { field: 'size', headerText: 'Size', minWidth: 50, width: '110', template: '${size}' }

      ]

    };`

[Sowmiya Padmanaban]

Hi Matthew George,  

 

Greetings from Syncfusion support. 

 

We have checked your reported problem with FileManager component. we can resolve your issue by setting _fm_modified in DateModified field of details view settings of FileManager component. 

 

  this.detailsViewSettings = { 

      columns: [ 

        { 

          field: "name", 

          headerText: "File Name", 

          minWidth: 120, 

          width: "auto", 

          customAttributes: { class: "e-fe-grid-name" }, 

          template: "${name}" 

        }, 

        { 

          field: "size", 

          headerText: "File Size", 

          minWidth: 50, 

          width: "110", 

          template: "${size}" 

        }, 

        { 

          field: "_fm_modified", 

          headerText: "Date Modified", 

          minWidth: 50, 

          width: "190" 

        } 

      ] 

    }; 

  } 

 

Refer the sample link below. 

 

https://stackblitz.com/edit/angular-yptaqt-jmwaef?file=app.component.ts 

 

Please let us know, if you need any further assistance. 

 

Regards,  

Sowmiya.P 

[Matthew George]

That fixed it, thanks!

[Sowmiya Padmanaban]

Hi Matthew,  

  

Most welcome. We are happy to hear that your problem has been resolved. Please contact us, if you need any help from us. 

  

Regards,  

Sowmiya.P