Extjs Combobox Autocomplete

Question

I am using Extjs 4 ComboBox with remote mode. but when i typed any character data is not filtered. and even focus is changed only for first 12 value. combobox image

I am new to Extjs 4. Please help me how to do this.

my code is:

    Ext.define('MyGroup.combo', {
           extend: 'Ext.form.ComboBox',

           alias: 'widget.mycombo',
        emptyText:'select keyword',
        store: keywordStore,
        valueField:'name',
           displayField:'name',
           mode: 'remote',
           autoSelect: false,
           selectOnFocus:true,
           //shadow:true,
           //forceSelection: false,
           //triggerAction: 'all',
           hideTrigger:true,
           //multiSelect:true,
           typeAhead:true,
        minChars:1
       });

       Ext.define('keywordModel', {
           extend: 'Ext.data.Model',
           proxy: {
               type: 'ajax',
               url : '/keywordServlet',
               method:'POST',
               reader: {
                   type: 'json',
                   root: 'rows'
                   //,totalProperty: 'totalCount'
               }
           },

           fields: [
               {name: 'name', mapping: 'name'}
           ]
       });

          var keywordStore = Ext.create('Ext.data.Store', {
             // pageSize: 10,
              model: 'keywordModel'
          });

Why you are using define?Shall you post how you are calling this combo? — Unknown
Have you tried with normal combobox i mean without using mucombo.Is it working fine(filter)? — Unknown
If you are trying to override the combobox then this is not the correct way to override. — Unknown

Unknown Unknown · Accepted Answer · 2011-08-12T09:27:27

As per my knowledge i think this will be helpful for you:

Ext.define('MyGroup.combo', {
           extend: 'Ext.form.ComboBox',
           alias: 'widget.mycombo',
    initComponent: function() {
        this.callParent([arguments]);
    }
});

var keywordStore = Ext.create('Ext.data.SimpleStore',{
    fields: ['id', 'name'],
    data: [[1, 'mr'],[2, 'mr(yes)'],[3, 'mr(no)'], [4, 'example'], [5, 'example(yes)'],[6,'example(no)'],[7,'sample'],[8,'sample(yes)'],[9,'sample(no)'],[10,'mrs'],[11,'mrs(yes)'],[12,'mrs(no)']]
});

Ext.widget('mycombo',{
    xtype : 'combo',
        emptyText:'select keyword',
        store: keywordStore,
        valueField:'name',
           displayField:'name',
           mode: 'remote',
           autoSelect: false,
           selectOnFocus:true,
           //shadow:true,
           //forceSelection: false,
           //triggerAction: 'all',
           hideTrigger:true,
           //multiSelect:true,
           typeAhead:true,
        minChars:1,
    renderTo :document.body
       });

And one more thing is no one is trying to answer each and every question,but every one is trying to help some body like us:-)

Extjs Combobox Autocomplete

1 Answers