Slide 15
Slide 15 text
function crearNodo() {
// Se busca el nodo seleccionado
var nodo = Ext.getCmp('arbol').getSelectionModel().selNode;
var w = new Ext.Window({
title: 'Crear Nodo', width: 250, modal: true,
items: [{
xtype: 'form', id: 'formaCrearNodo', labelWidth: 40, url: 'arbol.php',
items:[{
xtype: 'hidden', name: 'accion', id: 'accion', value: 'crear'
},{
xtype: 'hidden', name: 'padre', id: 'padre', value: nodo.id
},{
xtype: 'textfield', fieldLabel: 'Texto', name: 'nombre', id:
'texto', allowBlank: false
}]
}],
buttons: [{
text: 'Guardar', handler: function() {
var forma = Ext.getCmp('formaCrearNodo');
// Recuperamos el nombre del nodo
var nombre = forma.getForm().getValues().nombre;
forma.getForm().submit({
success: function(a, resp) {
//resp.result.id
// Busca el parent Contenedor y lo cierra
nodo.appendChild(new Ext.tree.TreeNode({
id: resp.result.id,
text: nombre
}));
forma. findParentByType('window').hide();
},
failure: function(a, b) {
// Se muestra un mensaje de error
Ext.MessageBox.show({
title: 'Error',
msg: 'Existion un error al crear el nodo!',
buttons: Ext.MessageBox.OK,
icon: Ext.MessageBox.ERROR
});
}
});
}
}]
});
w.show();
}
Lo primero es ver cual es el nodo
seleccionado, luego creamos una ventana
que presentará una forma, para que solo esté
activa esta ventana seleccionamos modal:
true, la ventana solo tiene un ítem que es la
forma y esta a su vez tiene 3 items y un
botón, el primer ítem es un campo oculto en
el cual almacenamos la acción que se
realizará, en este caso crear, el segundo
campo oculto almacena el padre y el tercero
es un campo de texto en el cual se escribe el
texto, luego existe un botón que es el
encargado de realizar el POST, osea enviar
la información al servidor, para esto es
necesario poder acceder a la forma que
hemos creado, en este caso accedemos
mediante su id de la siguiente forma
Ext.getCmp('formaCrearNodo'), y ahora
podemos acceder a la forma recuperar los
valores y enviar al servidor, es necesario
realizar getForm() debido a que el panel que
usamos “FormPanel” hereda de otra clase
sus atributos, al realizar el submit o ingreso
pueden existir 2 respuestas 1 correcta
success u otra failure, básicamente lo que
sucede es que cuando el servidor devuelve
una respuesta sin excepciones del servidor
como un error 500 significa que debe