Templates y Temas para ExtJS y Sencha Touch Bleext!
Bleextop! un desktop OpenSource para Ext4 y CodeIgniter http://bit.ly/pUwLJO
Como hacer funcionar el Formulario de contacto de table layout?
  • Vote Up0Vote Down peter3518peter3518 November 2011
    Posts: 45
    Hola:
    He bajado el ejemplo del formulario de contacto que está muy bueno! Pero no logro enviar los datos a mi php, he probado de varias maneras pero siempre el FF me tira error de sintaxis. Me podría orientar?
    Adunyo el código:


    Ext.ns("com.quizzpot.tutorial");

    com.quizzpot.tutorial.TableLayoutTutorial = {
    init: function(){

    //code goes here
    var win = new Ext.Window({
    //"xtype": "window",
    "title": "My Window",
    "width": 512,
    "height": 410,
    "layout": "fit",
    "items": [
    {
    "xtype": "form",
    "title": "",
    "labelWidth": 100,
    "labelAlign": "left",
    "layout": "table",
    "border": false,
    "bodyStyle": "padding:10px",
    "layoutConfig": {
    "columns": 3
    },
    "items": [
    {
    "xtype": "panel",
    "layout": "form",
    "border": false,
    "labelAlign": "top",
    "padding": 5,
    "defaults": {
    "width": 150
    },
    "items": [
    {
    "xtype": "textfield",
    "fieldLabel": "Nombre",
    "anchor": "100%"
    }
    ]
    },
    {
    "xtype": "panel",
    "layout": "form",
    "labelAlign": "top",
    "border": false,
    "padding": 5,
    "defaults": {
    "width": 150
    },
    "items": [
    {
    "xtype": "textfield",
    "fieldLabel": "Apellido",
    "anchor": "100%"
    }
    ]
    },
    {
    "xtype": "panel",
    "border": false,
    "layout": "form",
    "labelAlign": "top",
    "padding": 5,
    "defaults": {
    "width": 150
    },
    "items": [
    {
    "xtype": "textfield",
    "fieldLabel": "Teléfono",
    "anchor": "100%"
    }
    ]
    },
    {
    "xtype": "panel",
    "layout": "form",
    "labelAlign": "top",
    "border": false,
    "padding": 5,
    "defaults": {
    "width": 150
    },
    "items": [
    {
    "xtype": "textfield",
    "fieldLabel": "Email",
    "anchor": "100%"
    }
    ]
    },
    {
    "xtype": "panel",
    "layout": "form",
    "labelAlign": "top",
    "border": false,
    "padding": 5,
    "defaults": {
    "width": 150
    },
    "items": [
    {
    "xtype": "datefield",
    "fieldLabel": "Fecha de nacimiento",
    "anchor": "100%"
    }
    ]
    },
    {
    "xtype": "panel",
    "layout": "form",
    "labelAlign": "top",
    "border": false,
    "padding": 5,
    "defaults": {
    "width": 150
    },
    "items": [
    {
    "xtype": "combo",
    "fieldLabel": "Género",
    "anchor": "100%"
    }
    ]
    },
    {
    "xtype": "panel",
    "colspan": 3,
    "layout": "fit",
    "border": false,
    "height": 150,
    "items": [
    {
    "xtype": "htmleditor",
    "anchor": "100%",
    "fieldLabel": "Label",
    "height": 200,
    "width": 300
    }
    ]
    }
    ],
    fbar: {
    "xtype": "toolbar",
    "items": [
    {
    xtype: "button",
    text: "Guardar"
    ACÁ DEBERÍA IR EL LINK AL PHP
    },
    {
    xtype: "button",
    text: "Cancelar"
    }
    ]
    }
    }
    ]
    });

    win.show();

    }
    }

    Ext.onReady(com.quizzpot.tutorial.TableLayoutTutorial.init,com.quizzpot.tutorial.TableLayoutTutorial);


    Estyo tratando de hacer un formulario standar y este me gustó mucho, pero parece que todos los form actúan diferentes con los botones o todavía me falta mucho...:(
    Disculpen las molestias y gracias!

    Pedro
  • 3 Answers sorted by
  • Vote Up0Vote Down CrysfelCrysfel December 2011
    Posts: 897
    Tienes que agregarle un handler al botón y ahí escribir las lineas de código para hacer el submit del formulario ;)
  • Vote Up0Vote Down peter3518peter3518 December 2011
    Posts: 45
    Gracias por responder Crysfel, mira he probado muchas maneras y no doy pie con bola, evidentemente me falta mucho todavía para hacer las cosas con fluidez, si no es molestia, no tendrías un ejemplo para agregar el button handler a este formulario?
    Lo necesito para implementar en un trabajo...

    Muchas gracias.

    Pedro
  • Vote Up0Vote Down Hades616Hades616 December 2011
    Posts: 35
    Primero declara id:'form' al xtype: 'form' que tienes arriba dentro del "win"
    y Luego agrega al button:

    handler:function(){
    var form = getCmp('form');
    if (form.getForm().isValid()) {
    form.getForm().submit({
    url :'...url.php...',
    method :'POST',
    params: {
    //... parametros, si amerita...
    },
    waitTitle :'...titulo cualquiera...',
    waitMsg :'...msj cualquiera...',
    success: function(form,action){
    Ext.Msg.alert('Exito',action.result.msg);
    //... demas acciones ...
    },
    failure: function(form,action){ Ext.Msg.alert('Fallo',action.result.msg);
    }
    });
    }
    else {
    Ext.Msg.show({
    title:'...titulo cualquiera...',
    msg: '...msj cualquiera...',
    buttons: Ext.Msg.OK,
    icon: Ext.MessageBox.ERROR});
    }
    },
    scope:this,
    tooltip:'...comentario...',


    Espero te sirva de algo...
Add a Comment

Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

Login with Facebook Sign In with Twitter

Sign In Apply for Membership

Categories

In this Discussion

Poll

No poll attached to this discussion.

Tagged