ExtJS Group 6 related models

Question

Context

Some time ago, I used this answer to implement remote sorting and filtering. Using the format 'relatedModel.associatedModelField', I could easily resolve the expression in my server side code to query the database.

Problem

While this assignment, I ran into another grouping problem that I configured locally - related models . If I group a column that displays a related field, I cannot collapse or expand without errors. The same for the root mesh model does not cause any errors.

The problem can be reproduced in this fiddle .

The error trace in the console log is as follows:

ext-all-debug.js: 198133 Uncaught TypeError: Cannot read property 'isModel' of undefined

getMetaGroup @ ext-all-debug.js: 198133
doCollapseExpand @ ext-all-debug.js: 198284
collapse @ ext-all-debug.js: 198207
onGroupClick @ ext-all-debug.js: 198380
fire @ ext-all-debug.js: 20223
doFireEvent @ ext-all-debug.js: 21130
doFireEvent @ ext-all-debug.js: 64732
prototype.doFireEvent @ ext-all-debug.js: 54757
fireEventArgs @ ext-all-debug.js: 20983
fireEvent @ ext-all-debug.js: 20942
processSpecialEvent @ ext-all-debug.js: 188549
processItemEvent @ ext-all-debug.js: 188499
processUIEvent @ ext-all-debug.js: 168108
handleEvent @ ext-all-debug.js: 168061
fire @ ext-all-debug.js: 20223
fire @ ext-all-debug.js: 32463
publish @ ext-all-debug.js: 32439
doDelegatedEvent @ ext-all-debug.js: 32489
onDelegatedEvent @ ext-all-debug.js: 32476
(anonymous function) @ ext-all-debug.js: 6662

In the code, I used the solution as described above, and also applied the grouping function. This is not completely clean code, but it works as long as I respect the limits of the fix.

How do I solve this problem? Based on the type of problem, I believe that this means rewriting the entire grouping mechanism, but I don't like it!

Answer 1

. docs , :

, , , Object Array, Ext.util.Grouper , .

, groupers :

 features: [{
            ftype: 'grouping',
            remoteRoot: 'Summary',
            groupHeaderTpl: '{name}',
            collapsible: true,
            groupers:  [{
                          property: 'Customer.Address',
                          groupFn: function (val) {
                             return val.data.Job ? val.data.Customer.Address: '';
                        }
               }]
            }]

, groupFn .