Buenos días, mediante la implementación de la función 'mostrarDescripcion' y su utilización en 'renderer' he conseguido visualizar en un combobox el displayField de un combo cada vez que edito esa fila en el grid.

Ahora necesito que se realice esa misma opción al cargar los datos, es decir, que inicialmente me visualice el displayField de ese combo, pero no sé exactamente cómo ni dónde indicarlo...

Les dejo mi código a ver si alguien puede echarme una mano.

Gracias de antemano...


com.quizzpot.tutorials.Crud = {
renderer: muestraDescripcion,
init : function() {
//CRUD
var proxy = new Ext.data.HttpProxy({
api: {
read : "serverside/getContacts.php",
create : "serverside/createContact.php",
update : "serverside/updateContact.php",
destroy : "serverside/destroyContact.php"
}
});

var rd_random_employee_data = new Ext.data.JsonReader({}, ['idprovincia', 'descprovincia']);

var provincias = new Ext.data.Store({
reader: new Ext.data.JsonReader({
fields: ['idprovincia', 'descprovincia'],
root: 'rows'}),
proxy: new Ext.data.HttpProxy({
url: 'serverside/getProvincias.php'
}),
autoload:true

});

var provin = new Ext.form.ComboBox({
id: 'idpro',
store: provincias,
valueField: 'idprovincia',
lazyRender:true,
displayField: 'descprovincia',
mode: 'remote',
minChars : 0 ,
autoload:true
});

function muestraDescripcion(valor)
{
var comboTipoPregunta = Ext.getCmp('idpro');
var stx = comboTipoPregunta.getStore();
var index = stx.find('idprovincia',valor,0,true,false);

if(index>-1){
var record = stx.getAt(index);
return record.get('descprovincia');
}
};

var reader = new Ext.data.JsonReader({
totalProperty : 'total',
successProperty : 'success', //<--- el successproperty indica la propiedad que define si se ha insertado/actualizado o borrado con éxito
messageProperty : 'message',
idProperty : 'coddelegacion',

root : 'data' //<--- este es el nombre del parámetro que llega al servidor con el JSON modificado
},[
{name: 'descdelegacion', allowBlank: false},
{name: 'domiciliodelegacion', allowBlank: false},
{name: 'poblaciondelegacion', allowBlank: false},
{name: 'emaildelegacion', allowBlank: false},
{name: 'telefonodelegacion', allowBlank: false},
{name: 'faxdelegacion', allowBlank: false},
{name: 'codpostaldelegacion', allowBlank: false},
{name: 'provinciadelegacion', allowBlank: false},

]);

var writer = new Ext.data.JsonWriter({
encode : true,
writeAllFields : true //<--- decide si se manda al servidor solamente los campos modificados o todos
});

this.storeGrid = new Ext.data.Store({
id : "id",
proxy : proxy,
reader : reader,
writer : writer,
autoLoad: true,
autoSave : true //<--- hace las peticiones al servidor automáticamente
});

var textFieldEmail = new Ext.form.TextField({vtype: "email",allowBlank: false}),
textFieldDelegacion = new Ext.form.TextField({allowBlank: false}),
textFieldDomicilio = new Ext.form.TextField({allowBlank: false}),
textFieldPoblacion = new Ext.form.TextField({allowBlank: false}),

sm = new Ext.grid.CheckboxSelectionModel();

var textFieldTelefono = new Ext.form.TextField({
width: 80,
allowBlank:false,
maskRe : /['0-9'.-]$/,
plugins: [new Ext.ux.InputTextMask({
mask:'999-999999',
clearInvalid:false
})]
});

var textFieldFax = new Ext.form.TextField({
width: 80,
allowBlank:false,
maskRe : /['0-9'.-]$/,
plugins: [new Ext.ux.InputTextMask({
mask:'999-999999',
clearInvalid:false
})]
});

var textFieldCP = new Ext.form.TextField({
width: 60,
allowBlank:false,
maskRe : /['0-9'.-]$/,
plugins: [new Ext.ux.InputTextMask({
mask:'99999',
clearInvalid:false
})]
});

var pag = new Ext.PagingToolbar({
store:this.storeGrid
,displayInfo:true
,pageSize:1
});

var gridId=Ext.id();

this.grid = new Ext.grid.EditorGridPanel({
store : this.storeGrid,
id: gridId,
columns : [
sm,
{header:'Delegación', dataIndex:'descdelegacion',width:180,sortable: true, editor:textFieldDelegacion},
{header:'E-mail', dataIndex:'emaildelegacion',sortable: true,width:180,editor:textFieldEmail},
{header:'Domicilio', dataIndex:'domiciliodelegacion',sortable: true,width:150, editor:textFieldDomicilio},
{header:'Población', dataIndex:'poblaciondelegacion',sortable: true,width:150, editor:textFieldPoblacion},
{header:'Cod.Postal', dataIndex:'codpostaldelegacion',sortable: true,width:60, editor:textFieldCP},
{header:'Teléfono', dataIndex:'telefonodelegacion',sortable: true,width:70, editor:textFieldTelefono},
{header:'Fax', dataIndex:'faxdelegacion',sortable: true,width:70, editor:textFieldFax},
{header:'Provincia', dataIndex:'provinciadelegacion',sortable: true,width:90, scope: this, editor:provin, renderer: muestraDescripcion
}],
sm : sm,
border : false,
stripeRows : true,
bbar: pag,


clicksToEdit: 1
});

this.storeGrid.load();

var win = new Ext.Window({
title : "eProject - Gestión Delegaciones",
layout : "fit",
tbar : [
{text:'Añadir Delegación', scope:this, handler:this.addContact,iconCls:'save-icon'},
{text:"Eliminar Selección", scope:this, handler:this.onDelete,iconCls:'delete-icon'},
{text:"Exportar", scope:this, handler:this.exportPDF,iconCls:'pdf-icon'},
{text:"Exportar", scope:this, handler:this.exportExcel,iconCls:'excel-icon'}
],
width : 1000,
height : 300,
items : [this.grid]
});
win.show();

},

aviso: function()
{
alert("hola");
},

onDelete : function(){
var rows = this.grid.getSelectionModel().getSelections();

if(rows.length === 0){
return false;
}

this.storeGrid.remove(rows);
Ext.MessageBox.alert('eProject','Registro(s) Eliminado(s) Con Éxito');
},

addContact : function(){
var contact = new this.storeGrid.recordType({
delegacion : "",
domicilio : "",
poblacion : "",
email : "",
cp: "",
telefono: "",
fax: "",
provincia: "",
});

this.grid.stopEditing();
this.storeGrid.insert(0,contact);
this.grid.startEditing(0,1);
},

exportPDF: function(){
var rows = this.grid.getSelectionModel().getSelections();
var nSeleccionados = rows.length;
var nElementos = this.storeGrid.getCount();
var seleccionados = new Array();

if(rows.length === 0){
Ext.MessageBox.alert('eProject','No Ha Seleccionado Nada');
return false;
}

var i = 0;

while (i<nSeleccionados)
{
seleccionados[i]=rows[i].id;
i=i+1;
}

location.href="listado-delegaciones-sel.php?seleccion="+seleccionados;

},

exportExcel: function(){
var rows = this.grid.getSelectionModel().getSelections();
var nSeleccionados = rows.length;
var nElementos = this.storeGrid.getCount();
var seleccionados = new Array();

if(rows.length === 0){
Ext.MessageBox.alert('eProject','No Ha Seleccionado Nada');
return false;
}

var i = 0;

while (i<nSeleccionados)
{
seleccionados[i]=rows[i].id;
i=i+1;
}

location.href="excel-listado-delegaciones.php?seleccion="+seleccionados;
}
}
Ext.onReady(com.quizzpot.tutorials.Crud.init,com.quizzpot.tutorials.Crud);