Métodos y Propiedades más Utilizados

agradecimiento a : http://www.solclic.cl/category/apuntes/apuntes-desarrollo/apuntes-extjs4/

  • GRILLAS
    1. Obtener la fila seleccionada Selection Model  selType: “rowmodel”

var sel = nomGrilla.getSelectionModel().getLastSelected(); // nomGrilla es la variable que contiene la grilla

    1. Obtener la fila seleccionada con Selection Model  selType:“cellmodel”

var grid = Ext.getCmp(‘idDeGrilla’);

var recSel=grid.getSelectionModel().store.data.items[grid.selModel.position.row];

    1. Establecer un valor a un campo especifico dentro de una fila

record.set(‘dataIndex’, ‘valor’);  // record corresponde a la fila a establecer el valor – dataIndex corresponde al id especificado en el model

    1. Recorrer todas las filas de una grilla con el  fin de realizar validaciones especificas

var aDatosG = new Array(); // crear un arreglo de objetos para enviar vía ajax al servidor
Grilla.store.each(function(record){  // record corresponde a la fila.
/*validaciones a las filas*/
aDatosG[aDatosG.length]= record.data; // pasar los datos al arreglo de objetos
});

Ext.Ajax.request({ //enviar con Ajax los datos de la grilla por POST
url: ‘Servicios/archivoProcesador.php’,
method: ‘POST’,
params: {
accion: ‘guadar’, // parametro extra para indicar alguna acción
aDatos: Ext.encode(aDatosG) //codificar en json los datos a enviar NOTA:obviamente hay que decodificar los datos por el lado del servidor con json_decode($_POST[‘aDatos’]);
},
success: function(response){
//respuesta del servidor
}
});

    1. Resaltar una fila dentro de una grilla

nomGrilla.getView().addRowCls(0, ‘texto_rojo’); // nomGrilla es la variable que contiene la grilla / 0 corresponde a la propiedad viewIndex / ‘texto_rojo’ es el un CSS definido

    1. Crear menu contextual (menu clic derecho) en una grilla
 var gridMenu = Ext.create('Ext.menu.Menu', { items: [{text: 'Item 1'},{text: 'Item 2'}] }); var grilla = Ext.create('Ext.grid.Panel', { //... configuraciones de la grilla listeners: { beforeitemcontextmenu: function(view, record, item, index, e){ e.stopEvent(); // detener eventos con clic derecho del navegador gridMenu.showAt(e.getXY()); } } }); 

//Fin Grillas

 

  • FORMULARIOS
    1. Establecer un valor a un campo especifico dentro del formulario

var frm = Ext.getCmp(‘idFormulario’).getForm(); //obtiene el formulario
frm.findField(‘idCampo’).setValue(‘valor’); // Buscar el campo especificado según el id del campo

    1. Marcar o Desmarcar Checkbox en tiempo de ejecución

frm.findField(‘idCheckbox’).setValue(true); // frm es el formulario que se obtiene como en el ejemplo anterior

    1. Obtener los campos con sus respectivos valores de un formulario

var camposForm = frm.getFieldValues(); //retorna camposForm.campo_1, camposForm.campo_x NOTA:”frm” se obtuvo desde la variable o con Ext.getCmp(‘idFormulario’).getForm()

    1. textField de solo lectura con apariencia de desactivado
{
xtype: 'textfield',
value: 'Campo de solo lectura',
labelAlign: 'top',
fieldStyle: 'text-align:right',   // alinear texto contenido a la derecha
fieldLabel: 'Prueba de campo',
id: 'id_campo',
fieldCls : 'x-item-disabled',  // dar apariencia de deshabilitado
readOnly: true
}
    1. Ocultar o mostrar un campo textField en tiempo de ejecución

frm.findField(‘idCampo’).setVisible(false); // frm es el formulario que se obtiene como en el ejemplo anterior es posible obtener el campo directamente por el id con Ext.getCmp(‘idCampo’).setVisible(false);

    1. Detectar una tecla especial ENTER, F1,..,F12, ESC, etc. en una caja de texto o elemento
{ name: 'nombre', id: 'idCampo', fieldLabel: 'Este Label', listeners: { specialkey: function(field, event){ if (event.getKey() === event.ENTER) { alert('ENTER'); } } } }

//fin formularios