[APORTE] uso de id y ref en componentes
Hola, a lo mejor es un tema muy básico pero me gustaría compartir con uds un tema que en los foros veo que no siempre se entiende bien, el siguiente ejemplo es un formulario con una serie de componentes a los cuales hago accedo usando su id o su propiedad ref
Ext.onReady(function () {
Ext.QuickTips.init();
var container1 = new Ext.Container({
items: [
{
xtype: 'container',
height: 50,
id: 'id_sub_container',
ref: '../ref_sub_container',
layout: 'form',
items: [
{
xtype: 'displayfield',
value: 'HOLA!!!'
}
]
}
]
});
var store = new Ext.data.SimpleStore({
fields: ['dataFieldName', 'displayFieldName'],
data: [
['IQQ', 'Iquique'],
['STGO', 'Santiago'],
['NYC', 'Nueva York'],
['LA', 'Los Angeles']
],
autoLoad: false
});
var combo2 = new Ext.form.ComboBox({
store: store,
fieldLabel: 'ComboBox 2',
displayField: 'displayFieldName',
valueField: 'dataFieldName',
forceSelection: true,
mode: 'local',
triggerAction: 'all',
selectOnFocus: true,
editable: false,
id: 'id_mi_combo2',
ref: 'ref_mi_combo2'
});
var simple = new Ext.form.FormPanel({
id: 'id_form',
ref: 'ref_form',
title: 'Ejemplo de referencia e id',
labelWidth: 75,
frame: true,
bodyStyle: 'padding:5px 5px 0',
width: 350,
renderTo: Ext.getBody(),
items: [
container1,
{
xtype: 'combo',
store: store,
fieldLabel: 'ComboBox 1',
displayField: 'displayFieldName',
valueField: 'dataFieldName',
forceSelection: true,
mode: 'local',
triggerAction: 'all',
selectOnFocus: true,
editable: false,
id: 'id_mi_combo1',
ref: 'ref_mi_combo1'
},
combo2,
{
xtype: 'button',
text: 'selecciona un valor del combo 1 y presioname!',
id: 'id_boton1',
ref: 'ref_boton1'
}],
fbar:[{
xtype: 'button',
id: 'id_boton2',
text: 'Presioname tambien!',
ref:'../ref_boton2'
}]
});
simple.ref_boton1.on('click', btn1_click, this);
simple.ref_boton2.on('click', btn2_click, this);
function btn1_click(){
c = Ext.getCmp('id_mi_combo1');
if (c.getValue()===""){
alert('dije que selecciones primero!');
}else{
alert('campo valueField: '+simple.ref_mi_combo1.getValue());
alert('campo displayField: '+Ext.getCmp('id_mi_combo1').getRawValue());
combo2.setValue(simple.ref_mi_combo1.getValue());
c.clearValue();
}
};
function btn2_click(){
simple.ref_sub_container.setVisible(!simple.ref_sub_container.isVisible());
}
});
espero les sirva :-D
tokkaido
26/01/2011
yo prefiero trabajar con ref, según he leído en un par de artículos es mejor trabajar asi. No conocía el itemId en todo caso :-?
tokkaido
27/01/2011
Yo tampoco uso el ID, como dice @pasblin cuando trabajas en equipo y la aplicación es muy grande puedes llegar a tener problemas con los identificadores si no definen algunas reglas para asignarlos.
Saludos
Crysfel Villa
27/01/2011
Yo nunca uso id ;) es prefiero usar siempre itemId, ya que en un proyecto muy grande es facil que se repitan los ids y más si hay varios trabajadores en el mismo proyecto.
ItemId en conjunto con ref es lo mejor a mi manera de ver ;).
Invitado
27/01/2011
¿Conoces a alguien que pueda responder esta pregunta? Comparte el link en Twitter o Facebook
Es necesario registrarse para poder participar en el foro! Si ya tienes una cuenta puedes entrar y comentar en este foro.