1. #1
    Sencha User
    Join Date
    Sep 2012
    Location
    Ljubljana
    Posts
    23
    Vote Rating
    0
    TipyTop is on a distinguished road

      0  

    Default Answered: Selectfield with picker's slot

    Answered: Selectfield with picker's slot


    I create selectField via xtype and I pass hypernym in config to be a title in my picker's slot.
    Code:
    {{xtype: 'hmChoice',
    options: optsLang,
    hypernym: 'Language'}


    In hmChoice:
    Code:
    config: {
            usePicker: true,
            // hypernym you get as a title for the slot
            // options
            
            hypernym: '',
            defaultPhonePickerConfig: {
                useTitles: true,
            }
        },
        
        applyDefaultPhonePickerConfig: function(newConfig) {
            Ext.apply(newConfig, {
                slots: [
                    {
                        name: this.getHypernym().toLowerCase(),
                        title: this.getHypernym(),
                        data: this.getOptions()
                    }
                ]
            });
            
            return newConfig;
        }
        
    });
    Problem:
    When you change in picker it doesn't reflect on selectfield.


  2. The selectfield needs a name config:

    Code:
    Ext.define('MyField', {
        extend : 'Ext.field.Select',
        xtype  : 'myfield',
    
        config : {
            usePicker                : true,
            hypernym                 : '',
            defaultPhonePickerConfig : {
                useTitles : true
            }
        },
    
        applyDefaultPhonePickerConfig : function (newConfig) {
            var title = this.getHypernym();
    
            Ext.apply(newConfig, {
                slots : [
                    {
                        name  : title.toLowerCase(),
                        title : title,
                        data  : this.getOptions()
                    }
                ]
            });
    
            this.setName(title.toLowerCase());
    
            return newConfig;
        }
    });
    
    Ext.application({
        name   : 'Test',
    
        launch : function () {
    
            Ext.Viewport.add({
                xtype : 'formpanel',
                items : [
                    {
                        xtype    : 'myfield',
                        hypernym : 'Language',
                        options  : [
                            { text : 'One',   value : 1 },
                            { text : 'Two',   value : 2 },
                            { text : 'Three', value : 3 },
                            { text : 'Four',  value : 4 },
                            { text : 'Five',  value : 5 }
                        ]
                    }
                ]
            });
    
        }
    });
    Or pass the name config to the field

  3. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,641
    Vote Rating
    898
    Answers
    3573
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    The selectfield needs a name config:

    Code:
    Ext.define('MyField', {
        extend : 'Ext.field.Select',
        xtype  : 'myfield',
    
        config : {
            usePicker                : true,
            hypernym                 : '',
            defaultPhonePickerConfig : {
                useTitles : true
            }
        },
    
        applyDefaultPhonePickerConfig : function (newConfig) {
            var title = this.getHypernym();
    
            Ext.apply(newConfig, {
                slots : [
                    {
                        name  : title.toLowerCase(),
                        title : title,
                        data  : this.getOptions()
                    }
                ]
            });
    
            this.setName(title.toLowerCase());
    
            return newConfig;
        }
    });
    
    Ext.application({
        name   : 'Test',
    
        launch : function () {
    
            Ext.Viewport.add({
                xtype : 'formpanel',
                items : [
                    {
                        xtype    : 'myfield',
                        hypernym : 'Language',
                        options  : [
                            { text : 'One',   value : 1 },
                            { text : 'Two',   value : 2 },
                            { text : 'Three', value : 3 },
                            { text : 'Four',  value : 4 },
                            { text : 'Five',  value : 5 }
                        ]
                    }
                ]
            });
    
        }
    });
    Or pass the name config to the field
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  4. #3
    Sencha User
    Join Date
    Sep 2012
    Location
    Ljubljana
    Posts
    23
    Vote Rating
    0
    TipyTop is on a distinguished road

      0  

    Default


    Thank you mery much.

Thread Participants: 1

Tags for this Thread