Ext.onReady(function(){
   Ext.QuickTips.init();

   // turn on validation errors beside the field globally
   Ext.form.Field.prototype.msgTarget = 'side';

   var simple = new Ext.FormPanel({
      id: 'suscribe',
      renderTo: 'suscribe-form',
      labelWidth: 100,
      frame:true,
      border: false,
      width: 400,
       
      items: [{name: 'formPostName',value: 'newsletter',xtype: 'hidden'}, {name: 'formPostDescription',value: 'Inscription Newsletter',xtype: 'hidden'},
         {xtype:'fieldset',
            title: 'Your details',
            collapsible: false,
            autoHeight:true,
            defaults: {width: 210},
            defaultType: 'textfield',
            width: 354,
            items :[{fieldLabel: 'First name',name: 'firstName',allowBlank:false,maxLength: 100,itemCls: 'required'},
               {fieldLabel: 'Last name',name: 'lastName',allowBlank:false,maxLength: 100,itemCls: 'required'},
               {fieldLabel: 'Organization',name: 'organisation',maxLength: 100},
               {fieldLabel: 'Web site',name: 'webSite', maxLength: 100},
               {fieldLabel: 'Function',name: 'function', maxLength: 100},
               {fieldLabel: 'E-mail',name: 'email',vtype:'email',allowBlank:false,maxLength: 100,itemCls: 'required'}
            ]
         },
         {xtype:'panel',
            width: 354,
            buttonAlign:'center',
            buttons:[{
               text: 'Submit',
               handler: function(){
                  if(simple.getForm().isValid()){
                     simple.getForm().submit({url:'/formPosts', method: 'post', headers:{accept:'application/json'},
                        success: function(form, action){
                           obj = Ext.util.JSON.decode(action.response.responseText);
                           Ext.MessageBox.show({
                              title: 'Status',
                              msg: 'Form correctly received.',
                              buttons: Ext.MessageBox.OK,
                              icon: Ext.MessageBox.INFO,
                              modal: false
                           });
                        },
                        failure: function(form, action){
                           obj = Ext.util.JSON.decode(action.response.responseText);
                           Ext.MessageBox.show({
                              title: 'Status',
                              msg: 'An error occurred during the treatment.',
                              buttons: Ext.MessageBox.OK,
                              icon: Ext.MessageBox.ERROR,
                              modal: false
                           });
                        }
                     });
                  }
               }
            }]
         }
      ]
   });
});