Setting selected values for extjs tagfield

Question

I'm not too familiar with ExtJS nor the components and properties each component has, there were also a few examples that can be found.

I currently using ExtJS tagfield component like so, here's the fiddle :

Ext.onReady(function() {

    var store = Ext.create('Ext.data.Store', {
        fields: ['text'],
        data: []
    });

    Ext.create('Ext.panel.Panel', {
        renderTo: Ext.getBody(),
        width: 500,
        height: 400,

        items: [
            {
                xtype: 'tagfield',
                expand: Ext.emptyFn,
                forceSelection: false,
                store: store,
                createNewOnBlur: true,
                createNewOnEnter: true,
                hideTrigger: true
            }
        ]
    });

});

I was wondering what property I can use to set the default selected values of the tagfield, additionally, createNewOnEnter doesn't seem to work in this example.

Answer 1

You should just be able to set the value property directly on the tagfield component:

{
    xtype: 'tagfield',
    value: ['foo', 'bar']
    // ...
}

To get this working in your fiddle though I had to up the framework version from 5.0.0 to 5.1.0 - I'm guessing this was a bug but if you are not in a position to update your own project you will have to obtain a reference to the field and call setValue manually.