Default value in combo not visible - extjs

Question

I have grid.Panel in my extjs page. There are comboboxes in the grid. On load of the page, the combobox doesn't appear like combobox. Instead they look like empty cell. On click of the cell, they reveal the dropdown box like symbol.

var decisionComboStore = new Ext.data.ArrayStore({
   fields: ['abbr', 'action'],
   data : [
           ['proceed', 'Proceed'],
           ['upNotDone', 'Upload Not Done']
          ]
    });
var stockAuditGrid = Ext.create('Ext.grid.Panel', {
    {header: '<center><b>Decision</center>',  dataIndex: 'decision', flex:1,
        editor: {
            xtype:'combo',
                    store: decisionComboStore,
                            id: 'decisionCombo',
                           displayField:'action',
                           valueField: 'abbr',
                           mode: 'local',
                          typeAhead: false,
                emptyText: 'Select...',
            allowBlank:false
        },sortable: false, hideable: false}
 });

I don't know what else I should add to make it look like a combo box on load of the document. Also the box should display the default value.

It should be Extjs 4. It says, "This file is part of Ext JS 4 Copyright (c) 2011 Sencha Inc ", in the 1st two lines of my ext-all.js — Freakyuser, Sep 18 '14 at 11:06
check this http://stackoverflow.com/questions/5965416/extjs-4-combobox-default-value — Satya, Sep 18 '14 at 11:17
@Satya Followed that and added this line `Ext.getCmp('decisionCombo').setValue(store.getAt('0').get('abbr'));` but still on load of the document, the combo box looks like a text field. The dropdown symbol doesn't appear. — Freakyuser, Sep 18 '14 at 11:43
I have created a [fiddle here](https://fiddle.sencha.com/#fiddle/cfg). Can anyone please help me display the combobox on load (not on click), inside the grid? — Freakyuser, Oct 29 '14 at 05:49

score 1 · Answer 1 · answered Sep 18 '14 at 11:42

1

You expect something that cannot happen. Editors in an Ext grid are activated only on (dbl) click and there is always only one active at a time.

If are fine with this behavior but you need only appearance of combos then you must use css to style the grid cells.

answered Sep 18 '14 at 11:42

Saki

5,827
2
15
15

Thank you very much, I was trying for something, that is impossible then. Can you please provide any link for the css you mentioned.? – Freakyuser Sep 18 '14 at 12:25

Alexander · Answer 2 · 2014-09-18T12:32:12.213

0

You can't make it look like a combo box easily.

But you can use a custom renderer on the grid column to show Select... when the record's field is empty, without actually modifying the underlying data in the store:

http://docs.sencha.com/extjs/4.2.2/#!/api/Ext.grid.column.Column-cfg-renderer

Example:

renderer:function(value,meta) {
    if(value === undefined || value === null || value === "") {
        meta.style="color:#666"
        return "&lt;Select...&gt;";
    }
    return value;
}

edited Sep 18 '14 at 12:32

answered Sep 18 '14 at 12:26

Alexander

19,906
19
75
162

But in [this blog](http://blogs.walkingtree.in/2013/11/09/what-can-i-do-with-a-gridpanel-in-extjs/), I find that the combobox is possible. – Freakyuser Sep 18 '14 at 13:26
Then ask the author of that blog how he did this, or just read the code behind the link he provided. I didn't say it's impossible, but that "you can't make it look like a combo box easily". I won't read that blog for you and search for you in the code there... – Alexander Sep 18 '14 at 13:29
I tried the same that you have mentioned using renderer, to display the default value in this [fiddle](https://fiddle.sencha.com/#fiddle/cfg) but I was unable to do so. Can you please correct the fiddle, if possible? – Freakyuser Oct 29 '14 at 05:51
If you tried, you failed badly: I find neither editor nor renderer in your fiddle. – Alexander Oct 29 '14 at 07:50
Furthermore, your grid does not have a store, so no data will be shown in the grid (hence no combo). – Alexander Oct 29 '14 at 07:54
I tried adding store, editor & renderer but still I couldn't bring that combo box nor anything in the fiddle. I think there is something that I am missing in Fiddle – Freakyuser Oct 31 '14 at 06:55
Your renderer is not on the column, but on the grid. The docs clearly state that the renderer has to be on a column. And then you have to use `type:'string'`, not `'String'`. Case matters (and throws error in debugger console). The working fiddle is [here](https://fiddle.sencha.com/#fiddle/ck3) – Alexander Oct 31 '14 at 08:27

Default value in combo not visible - extjs

2 Answers2