Modificar datos de una grid en un formulario
Hola amigos se me esta presentando el siguiente problema, tengo una grid en la cual quiero modificar los datos de una de sus filas, cuando llamo a la ventana que contiene el formulario por primera vez los datos se cargan perfectamente, pero si cierro esta ventana y deseo editar otra fila ya no me vuelven a aparecer los datos de esa otra fila en el formulario este se carga vacio completamente, os dejo el código a ver si alguien encuentra el error pues ya he tratado de varias formas y nada.
Ext.onReady(function(){
Ext.BLANK_IMAGE_URL = 'ext/resources/images/default/s.gif';
Ext.QuickTips.init();
Ext.form.Field.prototype.msgTarget = 'side';
var ventanaIns,ventanaMod,rec;
//
//Construyo la Grid de Datos
//
//El store de datos
var storeUsuarios= new Ext.data.JsonStore({
url: 'php/grid.php',
root: 'data',
totalProperty: 'total',
paramNames: {
start : 'offset',
limit : 'size',
sort : 'sort',
dir : 'dir'
},
fields: [
{name: 'idUsuario', type:'int'},
'usuario','ip','mac',
{name: 'status',type:'boolean',align:'center'},
'pass'
]
});
storeUsuarios.load();
//Botones de la Grid
var btnEliminar= new Ext.Button({
id:'btnEliminar',
text: 'Eliminar',
tooltip:'Eliminar Usuario',
iconCls:'user_delete',
handler: function(){
Eliminar();
}
});
var btnEncender= new Ext.Button({
id:'btnEncender',
text: 'Encender',
tooltip:'Encender PC',
iconCls:'power',
handler: function(){
Encender();
}
});
var btnModificar=new Ext.Button({
text: 'Modificar',
id:'btnModificar',
tooltip:'Modificar Usuario',
iconCls:'user_edit',
handler: function(){
Modificar();
}
});
var btnInsertar= new Ext.Button({
text: 'Nuevo',
id:'btnInsertar',
tooltip:'Nuevo Usuario',
iconCls:'user_add',
handler: function(){
Insertar()
}
});
//Render a los datos
function boolFormat(value, metaData, record, rowIndex, colIndex, store){
var ima=value?'<img src="img/on.png" alt="Endendida">':'<img src="img/off.png" alt="Apagada">';
return ima;
}
//Acción de las filas
var sm = new Ext.grid.RowSelectionModel({
singleSelect : true,
listeners : {
rowselect : On_RowClick
}
});
function On_RowClick(sm, indiceFila, record){
rec = recx = record;
datos = indiceFila;
}
//Contruimos las GRID
var usuarios= new Ext.grid.GridPanel({
title:'Listado de Usuarios',
store: storeUsuarios,
sm:sm,
renderTo: document.body,
frame: true,
height: 400,
width: 520,
stripeRows: true,
loadMask: {msg:'Cargando datos'},
columns:[
new Ext.grid.RowNumberer(),
{
header:'Nombre',
dataIndex:'usuario'
},
{
hidden: true,
hideable: false,
dataIndex: 'idUsuario'
},
{
hidden: true,
hideable: false,
dataIndex: 'pass'
},{
header:'Dirección IP',
dataIndex:'ip'
},{
header:'MAC',
dataIndex:'mac',
width: 110
},{
header:'Estado',
dataIndex:'status',
width: 50,
renderer:boolFormat
}],
tbar:[btnInsertar,'-',btnModificar,'-',btnEliminar,'->',btnEncender],
bbar : new Ext.PagingToolbar({
pageSize : 25,
store: storeUsuarios
})
});
function Insertar(){
var usuario= new Ext.form.TextField({
fieldLabel: 'Nombre',
blankText: 'Debe poner un nombre',
allowBlank: false,
name: 'usuario'
});
var ip= new Ext.form.TextField({
fieldLabel: 'Dirección IP',
blankText: 'Debe poner un ip',
allowBlank: false,
name: 'ip'
});
var pass= new Ext.form.TextField({
fieldLabel: 'Contraseña',
blankText: 'Debe poner su password',
allowBlank: false,
inputType:'password',
name: 'pass'
});
var mac= new Ext.form.TextField({
fieldLabel: 'Dirección MAC',
blankText: 'Debe poner su Mac',
allowBlank: false,
name: 'mac'
});
var status= new Ext.form.Hidden({
value: 'false',
name: 'status'
});
var fpanel= new Ext.FormPanel({
url: 'php/salva.php',
border:false,
frame: true,
items: [usuario,pass,ip,mac,status]
});
if(!ventanaIns){
ventanaIns= new Ext.Window({
title: 'Insertar Usuario',
width: 400,
items: fpanel,
buttons:[{
text:'Entrar',
align:'center',
handler: function (){
if(fpanel.getForm().isValid()){
fpanel.getForm().submit({
waitMsg: 'Guardando...',
success: function(fp, o){
Ext.MessageBox.alert('Datos','Datos Insertados');
storeUsuarios.reload();
fpanel.getForm().reset();
},
failure:function(fp, o){
console.info(o);
}
});
}
}
},{
text:'Cerrar',
align:'center',
handler: function (){
fpanel.getForm().reset();
ventanaIns.hide();
}
}]
});
ventanaIns.show();
}else{
ventanaIns.show();
}
}
var fmpanel;
function Modificar(){
var usuario= new Ext.form.TextField({
fieldLabel: 'Nombre',
blankText: 'Debe poner un nombre',
allowBlank: false,
name: 'musuario',
id:'musuario'
});
var ip= new Ext.form.TextField({
fieldLabel: 'Dirección IP',
blankText: 'Debe poner un ip',
allowBlank: false,
name: 'mip',
id:'mip'
});
var pass= new Ext.form.TextField({
fieldLabel: 'Contraseña',
blankText: 'Debe poner su password',
allowBlank: false,
inputType:'password',
name: 'mpass',
id:'mpass'
});
var mac= new Ext.form.TextField({
fieldLabel: 'Dirección MAC',
blankText: 'Debe poner su Mac',
allowBlank: false,
name: 'mmac',
id:'mmac'
});
var status= new Ext.form.Hidden({
value: 'false',
name: 'mstatus',
id:'mstatus'
});
fmpanel= new Ext.FormPanel({
url: 'php/mod.php',
id:'fmpanel',
border:false,
frame: true,
items: [usuario,pass,ip,mac,status]
});
if(!ventanaMod){
ventanaMod= new Ext.Window({
title: 'Modificar Usuario',
width: 400,
closeAction: 'hide',
items: fmpanel,
buttons:[{
text:'Entrar',
align:'center',
handler: function (){
if(fmpanel.getForm().isValid()){
fmpanel.getForm().submit({
waitMsg: 'Actualizar...',
params:{'idUsuario': storeUsuarios.data.items[datos].get('idUsuario')},
success: function(fp, o){
Ext.MessageBox.alert('Datos','Datos Actualizados');
storeUsuarios.reload();
fmpanel.getForm().reset();
},
failure:function(fp, o){
console.info(o);
}
});
}
}
},{
text:'Cerrar',
align:'center',
handler: function (){
fmpanel.getForm().reset();
ventanaMod.hide();
}
}]
});
ventanaMod.show();
//fmpanel.getForm().loadRecord(rec);
LLenarForm();
}else{
ventanaMod.show();
//fmpanel.getForm().loadRecord(rec);
LLenarForm();
}
}
function LLenarForm(){
fmpanel.findById('musuario').setValue(storeUsuarios.data.items[datos].get('usuario'));
fmpanel.findById('mip').setValue(storeUsuarios.data.items[datos].get('ip'));
fmpanel.findById('mpass').setValue(storeUsuarios.data.items[datos].get('pass'));
fmpanel.findById('mmac').setValue(storeUsuarios.data.items[datos].get('mac'));
fmpanel.findById('mstatus').setValue(storeUsuarios.data.items[datos].get('status'));
}
});
Usuario no registrado
21/10/2009
Hola ogonzalezf, no he podido revisar tu code en mi máquina, pero lo que observo es lo siguiente:
1) Cada vez que llamas a la funcion Modificar(), estas volviendo a crear las cajas de texto, y demas controles del formulario, lo que sería válido si es que trabajas tu ventana con closeAction:'close', pero como lo estás haciendo con closeAction:'hide', entonces tu ventana nunca se destruye, por tanto tu formulario que creaste por primera vez tampoco.
2) Entonces te sugiero que pruebes poniendo tus instancias de compoentes (textfield, etc) y el fmpanel= new Ext.FormPanel.. dentro del
if(!ventanaMod){...} para que solo se cree una vez y no se este creando a cada momento.
3) El problema está en que cambias la referencia del formulario por cada llamada a la funcion Modificar(), entonces en la función LLenarForm() se está seteando los valores a un formulario nuevo (que no se está viendo), ya que este nuevo formulario, no es el que pusiste inicialmente.
saludos
Invitado
23/10/2009
¿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.