View Full Version : extJS 4: combobox in Grid is not being populated

19 Feb 2012, 4:43 PM

Ext version tested:

Ext 4.0.7

Browser versions tested against:

Opera 10.60
FF10.02 (firebug 1.9.1 installed)
Iron Browser 16.0.95


After clicking the combobox trigger the store is successfully populated from the server (or local store) but the data is not displayed in the combobox, only empty lines.

Steps to reproduce the problem:

Create a grid with a combobox column.
Define the store within the editor property, either using local or remote data.
Display the combobox.

The result that was expected:

The combobox should display the store elements.

The result that occurs instead:

The combobox only displays empty lines

Test Case:

Ext.create('Ext.grid.Panel', {
id: 'grid-Listado',
store: store,
width: 800,
height: 500,
title: 'Suscriptores',
verticalScroller: {
xtype: 'paginggridscroller',
activePrefetch: false
loadMask: true,
disableSelection: true,
invalidateScrollerOnRefresh: false,
viewConfig: {
trackOver: false
renderTo: 'listado',
plugins: rowEditor,
columns: [
{ text : 'Pais',
id: 'comboPais',
width : 100,
dataIndex: 'PaisId',
editor: {
xtype: 'combobox',
queryMode: 'server',
store: Ext.create('Ext.data.Store',{
autoLoad: true,
fields: [
{name: 'PaisId', type: 'number'},
{name: 'Pais'}
proxy: {
type: 'ajax',
url: 'usuarios/db.php?task=p',
reader: {
type: 'json',
root: 'results'
valueField: 'PaisId',
displayValue: 'Pais',
triggerAction: 'all',
typeAhead: true



In the screenshot it's possible to see that option lines for the exact number of elements in the store were created but not populated; I typed manually "Costa Rica" to check that the results could be displayed.

Debugging already done:

Tested the combobox as individual object in document.body: works fine both with remote and local data stores.
Predefined the combobox object first and then called it in the editor option in the grid column: doesn't work.

Possible fix:

Please let me know :D

Operating System:

Win7-64 Pro

19 Feb 2012, 5:09 PM
You made a mistake in configuring your combobox. You used displayValue while in fact it must be displayField. Try to fix it as below:

valueField: 'PaisId',
displayField: 'Pais',
triggerAction: 'all',
typeAhead: true

19 Feb 2012, 5:22 PM
Thank you so much @vietits, that was it. I don't dare to say how many hours I spent due to this mistake :((. Now I can go on :)