How to populate users as dropdown in the cq5 dialog

Hi All,

My requirement is "populate the users as drop down in the dialog". I am getting users from external database in json format.

I have created a custom widget by extending "CQ.Ext.form.ComboBox". The json data format includes "name and email" , i have to populate the name in the dropdown, but i tried with the following code but the data is not storing in the store object.

How to populate the drop down and I have to filter the drop down.

 this.store = new CQ.Ext.data.JsonStore({                  
                url: '/services/userdata',            
                root: 'users',               
                fields: ['name', {name: 'display', mapping: 'name'}]                
            });        
        
        this.valueField = 'name';
        this.displayField = 'display';
        this.autoSelect = 'false';
        
        this.on('beforequery', function(queryEvent) {
            var formattedQuery = {
                "condition": [[
                    {
                        "named": '%' + queryEvent.query + '%'
                    },
                    {
                        "contains": {
                            "property": "profile/@name",
                            "expression": '*' + queryEvent.query + '*'
                        }
                    }
                ]]
            };
        
            queryEvent.query = JSON.stringify(formattedQuery);
            console.log("queryEvent value: "+queryEvent);
            return queryEvent;
        });

Please help me to achieve this.

Thanks.