View Full Version : unable to set default value from xtype: 'combo' selection at new grid window

6 Aug 2014, 10:08 PM
Hello Experts,
We have a requirement to display plant name based on dynamically plant selected in a grid view. I tried all the options so far but unable to succeed.

My requirement is for any new entries to be inserted into a screen, a new window will open up and in that window, i have plant, plant name, storage location as input fields. Based on the plant selection by the user at first column, plant name and storage location should populate. i am able to create the dynamic selection of plant name and storage location into respective combo boxes, so user can select from there. since one plant will have multiple storage locations, so the combo box is working as desired by user, as they have to again select one storage location from the drop down.

Issue: However one plant will have only one plant name, and currently in drop down the respective plant name is appearing. I want to make that as default selection instead of user again selecting from the drop down.

I tried the value option, and listeners etc etc. But it is not helping.
even hard coding with id is also not helping out.

please suggest if any alternative solution to this issue.

Code snippet is as given below.

var editorName = {
xtype : 'combo',
id : 'plantName',
allowBlank : true,
forceSelection: false,
store: PlantNameStore,
displayField: 'plantRender',
valueField: 'plantName',
<%-- value : PlantNameStore.getAt(0).get('plantName'),--%>
queryMode: 'local',
typeAhead: true,
minChars: 1,
flex : 1,
triggerAction: 'all',
width : 200,
selectOnTab: true,
selectOnFocus: true,
emptyText: "Select Plant Name"
<%-- listeners: { load: function(store) {
var record = {};
record[me.valueField] = '';
record[me.displayField] = '0100';
store.insert(0, record);
<%-- listeners: {
load: function () {
//this sets the default value to plantName after the store loads
var combo = Ext.getCmp('comboName');
<%-- listeners: {
afterrender: function(combo) {
var recordSelected = combo.getStore().getAt(0);
alert (recordSelected);
<%-- listeners: {
boxready: function(){
// fire the select event ( Event in extjs )

var PlantNameStore = Ext.create('Ext.data.Store', {
fields : ['plantId', 'plantName', 'plantRender'],
autoLoad: true,
proxy: {
type: 'ajax',
reader: {
type: 'json'
api: {
read : 'Test.htm?action=read'


since it is a single filed value, instead of string population, can i select from data base, directly the value via a page attribute and display in screen.

8 Aug 2014, 3:47 PM

You can set a load listener on the combo's store to set the value of the combo using the single store's record. Below is an example:


10 Aug 2014, 10:30 PM
though the default selection is now occurring as per below suggested code, however the render To functionality is actually displaying the combo in the main panel now. I mean i have a main panel and then a new window in which the grid display is occurring. when i wrote below code in my grid editor, the combo is shifted to main panel instead of appearing in new window grid box.

Please suggest.

13 Aug 2014, 9:53 PM
I could find the soluton by adding a listener to my store load as below.
listeners: {
select: function(combo, record, eOpts) {
params: {
plant: combo.getValue()
params: {
plant: combo.getValue()
var recordSeleted = combo.findRecord(combo.valueField, combo.value);
var selectedName = recordSeleted.data.plantName;
var gridSelect = Ext.getCmp('PGridNew');
var position = gridSelect.getSelectionModel().getCurrentPosition();
var cellToUpdate = gridSelect.getSelectionModel().getCurrentPosition();
var recordAtPosition = gridSelect.getStore().getAt(position.row);

thank you for the valuable suggestions.