Combobox Items unselectable

Question

In ExtJS I have something rather weird with my combobox. The combobox is populated but in some cases, all but the 2 first entries are removed. If I stay on the same page and process a new item on this screen (thus the all fields and thus the combobox would be reloaded), the combobox is now completely populated however the remove function is runned. The weird thing is that all items are in the combobox, but the only the items that didn't get removed are in fact selectable and clickable. If I would click any other item that is visible in the list, it just wouldn't do anything (even the combobox wouldn't collapse). What could be the cause of this?

I know you guys want code but it's simple impossible to post code because the code at the company I work at is so huge and complex that there would be too much to paste in here. I'm just wondering if any of you guys have had something similar.

Also, a textbox is above the combobox. If you would fill in the textbox with a value from the combobox, the combobox would jump to the correct value. With the 2nd run (which I described above), if I would type a value that is visible in the combobox but unselectable, it would not jump to that value in the combobox. It seems that these values are only visible but that's it.

EDIT:

Some other weird behavior: if I click in the combobox (so you can actually type text) and press any button, the combobox will be magically transformed to the correct form. By this I mean that only the 2 first items are now visible. I do not have any listener that would do this on my combobox...

Perhaps a "refresh" of that combobox would be enough? However, this doesn't explain then why the combobox behaved that way in the first place. Got it in FF and IE.

We understand the enormity of data that many companies have - we all do - but, perhaps you could create a new project, pare down the data elements a bit, and try what you want before you ask people here for help. — Dean.DePue
That's fairly impossible. The combobox is fed by an ajax call that calls Java code. It's pretty enormous... — Valentin Grégoire

Saki Saki · Accepted Answer · 2014-05-28T15:41:55

Without the code, you say you cannot provide, I can only guess: See if you have idProperty defined for the model and if the idProperty matches one of the fields, if valueField of the combo is same as the value of idProperty and last if you receive records with unique ids from the server. The combo config should look similar to this:

Ext.define('ComboModel',{
     extend:'Ext.data.Model'
    ,idProperty:'custId'
    ,fields:[
         {name:'custId', type:'int'}
        ,{name:'custName', type:'string'}
    ]
});

Ext.define('ComboStore',{
     extend:'Ext.data.Store'
    ,model:'ComboModel'
});

Ext.create('Ext.form.field.ComboBox',{
     store:Ext.create('ComboStore')
    ,valueField:'custId'
    ,displayField:'custName'
});

Of course you would most likely need additional config options for the above classes. And custId must be unique for all combo store records.

Combobox Items unselectable

2 Answers