I have this model of Cities defined in ExtJS
Ext.define('Packt.model.staticData.City', {
extend : 'Packt.model.sakila.Sakila',
idProperty : 'city_id',
fields : [{
name : 'city_id'
}, {
name : 'city'
}/*, { //doesn't work
//name : 'country_id',
xtype: 'combobox',
store: Ext.getStore('countries'),
fieldLabel: 'Choose Country',
//queryMode: 'local',
displayField: 'country',
valueField: 'country_id',
}*/],
associations : [{
type : 'belongsTo',
model : 'Country',
primaryKey : 'city_id',
foreignKey : 'country_id'
}]
});
Is it possible to create a combobox in a model, something like the code in comments above?
I want to create row in my grid and for country I want countries listed in combobox. Each menu item of the StaticData list loads the same Ext.ux.LiveSearchGridPanel with different data/store/model.
When I click add button this is what happens:
onButtonClickAdd : function(button, e, options) {
var grid = button.up('staticdatagrid'),
store = grid.getStore(),
modelName = store.getProxy().getModel().modelName,
cellEditing = grid.getPlugin('cellplugin');
store.insert(0, Ext.create(modelName, {
last_update : new Date()
}));
/*
cellEditing.startEditByPostion({
row : 0,
column : 1
});
*/
},
No way!! You can add combobox in your grid row using editor plugin.Something like this:
cellEditing = new Ext.grid.plugin.CellEditing({
clicksToEdit: 1
});
Ext.create('Ext.grid.Panel', {
title: 'Simpsons',
store: Ext.data.StoreManager.lookup('simpsonsStore'),
plugins: [cellEditing],
columns: [{
text: 'Name',
dataIndex: 'name'
}, {
text: 'Countries',
dataIndex: 'country',
editor: new Ext.form.field.ComboBox({
typeAhead: true,
selectOnTab: true,
store: countryStore,
})
})
}],
height: 200,
width: 400,
renderTo: Ext.getBody()
})]