Question

Please can anyone help me implement a Sencha Picker as seen in Sencha 2 KitchenSink.
i.e. /examples/kitchensink/#demo/overlays

I keep getting this error…

02-15 13:41:38.879: E/Web Console(285): Attempting to create a component with an xtype that has not been registered: [object Object] at undefined:0

Here is a snippet of my code

MrFantastic.views.faith = new Ext.Panel({
        id:'faith',
        title:'Faith',
        scroll:'vertical',
        style:'background-color:#ffffff',
        items: [

                {
                    xtype: 'fieldset',
                    layout: {
                        align: 'stretch',
                        type: 'vbox'
                    },
                    defaults:{
                        xtype: 'radiofield',
                        flex: 1,
                        labelWidth:'85%'
                    },
                    items: [
                        {
                            label: 'Intolerable',
                            name:'mode'
                        },
                        {
                            label: 'Tolerable',
                            name:'mode'
                        },
                        {
                            label: 'Compatible',
                            name:'mode'
                        },
                        {
                            label: 'Admirable',
                            name:'mode'
                        }
                    ]
                }
            ],
            dockedItems: [
                          {
                              dock:'top',
                              cls:"faith",
                              width:'100%',
                              height:'50%'
                          },
                          {
                              html:'<div class="text_pane"><h3>faith <span>{noun} {feyth}</span>:</h3><ol><li>belief in God or in the doctrines or teachings of religion</li><li>a system of religious belief</li><li>a strong belief in a supernatural power or powers</li></ol><!--<span>If you ask almost any lady what kind of man she wants for a husband, she is likely to say to you, "I want a God fearing man." This probably because she believes that a God feating man will be more faithful and truthful.</span>--></div>'
                          },
                          {
                              xtype: 'toolbar',
                              dock: 'bottom',
                              items: [
                                  {
                                      xtype: 'button',
                                      itemId: 'Previous',
                                      ui:'back',
                                      text: 'Previous',
                                      handler: function () {
                                          MrFantastic.views.viewport.setActiveItem('mrf_home', { type: 'slide', direction: 'right' });
                                      }
                                  },
                                  {
                                      xtype: 'spacer'
                                  },
                                  {
                                      xtype:'button',
                                      text: 'Score Him',
                                      handler: function () {
                                          if(!this.picker)
                                          {
                                              this.picker = Ext.create('Ext.Picker',{
                                                  slots:[
                                                         {
                                                             name:'compat',
                                                             title:'Compatibility Score',
                                                             data:[
                                                                   {text:'Intolerable', value:1},
                                                                   {text:'Tolerable', value:2},
                                                                   {text:'Compatible', value:3},
                                                                   {text:'Intolerable', value:4}
                                                                   ]
                                                         }
                                                         ]
                                              } );
                                          }
                                          this.picker.show();
                                      }
                                  },
                                  {
                                      xtype: 'spacer'
                                  },
                                  {
                                      xtype: 'button',
                                      text: 'Next',
                                      ui:'foward',
                                      handler: function () {
                                          MrFantastic.views.viewport.setActiveItem('family', { type: 'slide', direction: 'left' });
                                      }
                                  }
                              ]
                          }
                      ]
    });

Please help me. Thank you.

Answer 1

Put this code in the handler: function ()

    if(!this.picker){
    this.picker = new Ext.Picker({
        slots: [
            {
                name : 'compat',
                title: 'Compatibility Score',
                data : [
                    {text: 'Intolerable', value: 1},
                    {text: 'Tolerable', value: 2},
                    {text: 'Compatible', value: 3},
                    {text: 'Intolerable', value: 4}
                ]
            }
        ]
    });
}
    this.picker.show();