CODEWITHSUNDEEP
extjsextjs4.1
Jacobian
Jacobian

Reputation: 10842

Combo loses focus on typing

My combo uses remote query. When the user types something, the server returns matching results. However, when there are a lot of matching results, then the combo expands, loses focus and highlights the firts record returned by the server. The combo has these properties:

...
queryMode:'remote',
enableKeyEvents:true,
forceSelection:true,
...

The screen of what is going on is here:

enter image description here

So, as you can see, when the user typed the last character, the server returned records and for some (I think stupid) reason highlighted the first record. But what is more important there is no focus any longer and the user has to put cursor on the field again to continue typing. To solve this problem, I tried these events:

 'blur':function(){
    this.focus();
  },
  'keydown':function(){
    this.focus();
  },
  'keypress':function(){
    this.focus();
  },
  'keyup':function(){
    this.focus();
  },

But there is no effect. I also tried to use load event, but it also has no effect.

Upvotes: 0

Views: 962

Answers (3)

user2795164
user2795164

Reputation: 31

I could solve the similar issue with focus be two actions:

  1. Set "selectOnFocus: false"
  2. Update doRawQuery. doRawQuery: function() { var me = this;

... me.inputEl.focus(); }

If you have your overridden version (I believe you should to not change original plugin), you can do it this way to not duplicate the logic: doRawQuery: function() { var me = this;

    me.callParent(arguments);
    me.inputEl.focus();
}

Upvotes: 1

cesargroening
cesargroening

Reputation: 323

I had this issue too, for solve it use the afterQuery property in the combo. Something like this:

afterQuery: function() {
    combo.setRawValue(combo.lastQuery);
    },

pd: I think this is a Bug, but i'm not sure about it...

Upvotes: 1

Igor Semin
Igor Semin

Reputation: 2496

xtype: 'combo',
...
listeners:{
        // repair raw value after blur
        blur:function() {
            var val = this.getRawValue();
            this.setRawValue.defer(1, this, [val]);
        }
}

Look this example(thanks to Saki)

Upvotes: 0

Related Questions