Using a composite value for displayField

[jlyman]

Been trying to come up with a way to display a composite field, or a returned value, on select fields, instead of just one field from a model. For example, if I have a store of User models, and each User entry has a firstName field and a lastName field, I would like to have a select field that gives me "firstName lastName" as the options, instead of just one or the other. The resulting display value would either be the combo of two fields, or ideally, the return value of a method (in the model or elsewhere).

I couldn't see a way to do this with displayField based on how the source is grabbing the value, so I'm assuming it would have to be done with something a little more tricky. Anybody come up with a good, generalizable way of doing this?

[TommyMaintz]

What you could do is create a field in your Model definition with a custom convert method. In this method you get passed the record and you can return any value. Here you could concatenate firstName + lastName into an aggregate field and use that as the displayField.

Let me know if that explanation didn't make any sense

[jlyman]

Thanks Tommy, that does make sense. I found the documentation for the convert method (http://docs.sencha.com/touch/2-0/#!/...ld-cfg-convert) but the code example seems to not be in the full MVC format, and I don't know how to address the convert method if I place it within the User model. For example, my model might look like

Ext.define('MyApp.model.User', {
    extend: 'Ext.data.Model',
        config: {
        fields: [
            {name: 'firstName', type: 'string'},
            {name: 'lastName', type: 'string'},
            {name: 'fullName', type: 'string', convert: 'fullNameConv' }
        ],

        proxy: {...}
    },
        fullNameConv: function (v, record) {
        return record.firstName + ' ' + record.lastName;
    }
}); 

What would be the proper way to address that fullNameConv method? (As written doesn't work, of course).

[TommyMaintz]

Unfortunately you can't just use a function name string. This is only supported in Controllers and Components in listener/control blocks. You will have to add that function as a static method on a singleton (MyApp.utils.fullNameConvert) or just add the function inline.

I don't think its such bad practice to just inline the function in this case. There is no reason that convert function needs to be on the prototype on the Model (other then because it just looks better ).

[jlyman]

Gotchya, and an inline will work just fine there. Thanks for the clarification and great answer!