Botones para enviar formulario por mail
Hola:
Estoy tratando de enviar un formulario ejemplo a un php. He buscado para ver como utilizar los botones para hacer el link a mimail.php en forma simple sin ajax pero no encontré nada que me aclare la oscuridad...:(
Me podrían dar una mano?
El código es:
Ext.onReady(function(){ Ext.QuickTips.init(); Ext.form.Field.prototype.msgTarget = 'side'; var bd = Ext.getBody(); bd.createChild({tag: 'h2', html: 'Form 3 - A little more complex'}); var top = new Ext.FormPanel({ labelAlign: 'top', frame:true, title: 'Multi Column, Nested Layouts and Anchoring', bodyStyle:'padding:5px 5px 0', width: 600, url : 'ejemplo6.php', items: [{ layout:'column', items:[{ columnWidth:.5, layout: 'form', items: [{ xtype:'textfield', fieldLabel: 'First Name', name: 'first', anchor:'95%' }, { xtype:'textfield', fieldLabel: 'Company', name: 'company', anchor:'95%' }] },{ columnWidth:.5, layout: 'form', items: [{ xtype:'textfield', fieldLabel: 'Last Name', name: 'last', anchor:'95%' },{ xtype:'textfield', fieldLabel: 'Email', name: 'email', vtype:'email', anchor:'95%' }] }] },{ xtype:'htmleditor', id:'bio', fieldLabel:'Biography', height:200, anchor:'98%' }], buttons: [{ text: 'Save' **************************************** ACA DEBERÍA IR EL LINK A mimail.php **************************************** },{ text: 'Cancel' }] }); top.render(document.body); });He avanzado en los usos de esta aplicación gracias a la generosa ayuda recibida en este foro,especialmente a Crysfel y Tokkaido. Paso a paso me van saliendo las cosas pero por momentos las neuronas se niegan a trabajar :( Gracias!!
te falta una coma (,) antes de handler, tienes que empezar a usar un IDE que te ayude en ese aspecto (indicarte si te falta una coma, un paréntesis, etc), te recomiendo el Komodo Edit que es gratuito y además tiene un plugin de ExtJS, puedes bajarlo de aquí:
http://www.activestate.com/komodo-edit/downloads
suerte
Ya le agregué la coma, se muestra en form en pantalla, lo completo y cuando hago click en "save" el FF me dice:
ok;
2 /* !eval(new String("this.compiled = function(values);)) */
Ya me bajé el komodo, uso el el notepad++, pero si este me resuelve problemas de sintaxis adelante entonces.
Gracias
Tokkaido:
Le he agregado el código donde pienso debería ir pero me FF me da error:
missing } after property list
[Interrumpir en este error] handler: function(){
Ext.onReady(function(){ Ext.QuickTips.init(); Ext.form.Field.prototype.msgTarget = 'side'; var bd = Ext.getBody(); bd.createChild({tag: 'h2', html: 'Form 3 - A little more complex'}); var top = new Ext.FormPanel({ labelAlign: 'top', frame:true, title: 'Multi Column, Nested Layouts and Anchoring', bodyStyle:'padding:5px 5px 0', width: 600, url : 'ejemplo6.php', items: [{ layout:'column', items:[{ columnWidth:.5, layout: 'form', items: [{ xtype:'textfield', fieldLabel: 'First Name', name: 'first', anchor:'95%' }, { xtype:'textfield', fieldLabel: 'Company', name: 'company', anchor:'95%' }] },{ columnWidth:.5, layout: 'form', items: [{ xtype:'textfield', fieldLabel: 'Last Name', name: 'last', anchor:'95%' },{ xtype:'textfield', fieldLabel: 'Email', name: 'email', vtype:'email', anchor:'95%' }] }] },{ xtype:'htmleditor', id:'bio', fieldLabel:'Biography', height:200, anchor:'98%' }], buttons: [{ text: 'Save' //EL CODIGO AGREGADO //SENTENCIA CON ERROR handler: function(){ //FIN //top porque es el nombre de tu form top.getForm().submit({ params: { parametro: 'aquí puedes pasar un parametro al lado de tu php' }, success: function(){ //aqui si deseas hacer algo después de que el envío fue exitoso }, failure: function(form, action){ if (action.failureType === 'server'){ //puedes devolver un error personalizado desde el lado de tu servidor respuesta = Ext.util.JSON.decode(action.response.responseText); Ext.MessageBox.show({ title: 'Error', msg: respuesta.errors.razon,//dentro de errors campo razon buttons: Ext.MessageBox.OK, icon: Ext.MessageBox.ERROR }); } else { //si colocas campos con alloBlank: false, es decir, obligatorios de esta //manera le indicas al usuario que hay campos que llenar o con error Ext.MessageBox.show({ title: 'Error', msg: 'Faltan datos o algunos de estos estan erroneos!', buttons: Ext.MessageBox.OK, icon: Ext.MessageBox.ERROR }); } }, scope: this }); } },{ text: 'Cancel' }] }); top.render(document.body); }); [/CODE]
es sencillo, debes realizar el submit de tu form en el handler del botón asi:
handler: function(){
//top porque es el nombre de tu form
top.getForm().submit({
params: {
parametro: 'aquí puedes pasar un parametro al lado de tu php'
},
success: function(){
//aqui si deseas hacer algo después de que el envío fue exitoso
},
failure: function(form, action){
if (action.failureType === 'server'){
//puedes devolver un error personalizado desde el lado de tu servidor
respuesta = Ext.util.JSON.decode(action.response.responseText);
Ext.MessageBox.show({
title: 'Error',
msg: respuesta.errors.razon,//dentro de errors campo razon
buttons: Ext.MessageBox.OK,
icon: Ext.MessageBox.ERROR
});
} else {
//si colocas campos con alloBlank: false, es decir, obligatorios de esta
//manera le indicas al usuario que hay campos que llenar o con error
Ext.MessageBox.show({
title: 'Error',
msg: 'Faltan datos o algunos de estos estan erroneos!',
buttons: Ext.MessageBox.OK,
icon: Ext.MessageBox.ERROR
});
}
},
scope: this
});
}
por el lado de el archivo php puedes capturar los parametros que enviaste asi:
$mi_param = $_POST['parametro'];
y para devolver que fue exitoso el procedimiento:
echo '{"success":true}';
si deseas generar un falla:
echo '{"success"; false, "errors": { "razon":"falló por esto y esto otro"}}';
espero te sirva :-D
¿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.