ExtJs 5 bind store to cell editor in grid - mvvm

Question

I'm trying to bind store to combobox editor in grid. My view is subclass of grid with cellediting plugin. I'm trying to bind at least static store with yes/no option. I tried many options and nothing worked.
Grid class:
Ext.define('App.view.school.room.RoomGrid', {
extend: 'Ext.grid.Panel',
alias: 'widget.school-room-grid',
controller: 'school-room-grid',
requires: [
'App.view.school.room.RoomGridController',
'App.view.school.room.RoomGridViewModel',
'Ext.button.Button',
'Ext.grid.plugin.CellEditing',
'Ext.grid.Panel',
'Ext.picker.Color',
'Ext.toolbar.Paging',
'Ext.toolbar.Toolbar'
],
reference: 'roomGrid',
viewModel: {
type: 'room'
},
bind: {
store: '{rooms}',
title: '{currentRoom.name}'
},
border: false,
itemId: 'testGrid',
glyph: 0xf0ce,
forceFit: true,
plugins: [
{
ptype: 'cellediting',
pluginId: 'editing'
}
],
header: {
title: 'Title',
padding: '4 9 4 9'
},
columns: [
//...
{
xtype: 'gridcolumn',
dataIndex: 'general',
text: 'SomeColumnYesNo',
editor:{
xtype: 'combobox',
bind: {
value:'{currentRoom.general}',
store:'{yesnoCombo}' //not working
},
displayField : 'name',
valueField : 'id',
selectOnFocus: true
}
}
],
buttons: [
{
itemId: 'addButton',
xtype: 'button',
width: 70,
scale: 'small',
text: 'Dodaj',
glyph: 0xf067
},
{
itemId: 'printButton',
xtype: 'button',
width: 70,
scale: 'small',
text: 'Drukuj',
glyph: 0xf02f
},
{
xtype: 'tbfill'
},
{
itemId: 'rejectButton',
xtype: 'button',
width: 22,
scale: 'small',
text: 'Anuluj',
glyph: 0xf021,
bind: {
disabled: '{!storeDirty}'
}
},
{
itemId: 'saveButton',
xtype: 'button',
width: 22,
scale: 'small',
text: 'Zapisz',
glyph: 0xf00c,
bind: {
disabled: '{!storeDirty}'
}
}
],
initComponent: function () {
me.callParent(arguments);
},
});
ViewModel class:
Ext.define('App.view.school.room.RoomGridViewModel', {
extend: 'Ext.app.ViewModel',
alias: 'viewmodel.room',
requires: [
'App.store.RoomStore',
'App.store.BuildingStore',
'App.store.TeacherStore',
'App.store.local.YesNoStore'
],
stores: {
//...
yesnoCombo:{
type:'local.yesnostore'
}
},
data: {
currentRoom: null
}
});
ViewController class:
Ext.define('App.view.school.room.RoomGridController', {
extend: 'Deft.mvc.ViewController',
alias: 'controller.school-room-grid',
requires: [
'App.view.school.room.RoomGridViewModel'
],
inject: [
'viewContext'
],
bind: {
currentRoom: '{currentRoom}',
store: '{rooms}'
},
config: {
currentRoom: null,
/** #type App.store.RoomStore */
roomStore: null,
/** #type App.context.ViewContext */
viewContext: null
},
control: {
'#': {
boxready: 'onBoxReady',
select: 'onSelect'
},
'#addButton': {
click: 'onAddButtonClick'
},
'#rejectButton': {
click: 'onRejectButtonClick'
},
'#saveButton': {
click: 'onSaveButtonClick'
}
},
onStoreLoading: function () {
Deft.Logger.info(this.$className + '.onStoreLoading');
var me = this;
me.getView().setLoading(true);
},
onStoreLoaded: function () {
Deft.Logger.info(this.$className + '.onStoreLoaded');
var me = this;
me.getView().setLoading(false);
},
//...
}
static store:
Ext.define('Perykles.store.local.YesNoStore', {
extend:'Ext.data.Store',
fields: ['id', 'name'],
autoLoad:false,
alias: 'store.local.yesnostore',
data : [
{"id":"true", "name":"Tak"},
{"id":"false", "name":"Nie"}
]
});
When I click on column binded to store to edit value instead of showing yes/no option in combobox i receive following error:
[E] Cannot modify ext-empty-store
Object
console.trace()
Uncaught Error: Cannot modify ext-empty-store
Any help would be appreciated.