Ext.onReady(function(){

    Ext.QuickTips.init();

    var simple = new Ext.FormPanel({
		renderTo : 'form_panel',
        //labelWidth: 100, // label settings here cascade unless overridden
        url:'results.php',
        labelAlign: 'top',
        frame: true,
		title: 'Contact Form',
		width: 240,
		bodyStyle:'padding:5px 5px 0',
        items: [{
					layout:'column',
					items: [{
							columnWidth:1,
                			layout: 'form',
                			items: [{
								xtype:'textfield',
                				fieldLabel: 'Full Name',
                				name: 'fullname',
								id: 'fullname',
								allowBlank:false,
								anchor:'95%'
							},{
								xtype:'textfield',
								fieldLabel: 'Email',
								name: 'email',
								id: 'email',
								vtype:	'email',
								allowBlank:false,
								anchor:'95%'
							},{
								xtype:'textfield',
								maxLength:	13,
								fieldLabel: 'Phone Number',
								name: 'phonenumber',
								id: 'phonenumber',
								anchor:'95%'
							},{
								xtype:'textfield',
								fieldLabel: 'Country of Origin',
								name: 'country',
								id: 'country',
								anchor:'95%'			
							},{
								xtype:'textarea',
								height: 75,
								fieldLabel: 'How can we help you?',
								name: 'specreq',
								id: 'specreq',
								anchor:'95%'						
							}]
						}]
					}],

       buttons: [{
        	text     : 'Submit',
            handler  : function(){
            	        var fullname_msg = Ext.get('fullname');
						var phonenumber_msg = Ext.get('phonenumber');
						var email_msg = Ext.get('email');
						var country_msg = Ext.get('country');
						var specreq_msg = Ext.get('specreq');
												
                        Ext.Ajax.request({
                            url : 'contacting.php', 
                            params : { fullname : fullname_msg.dom.value, phonenumber : phonenumber_msg.dom.value, email : email_msg.dom.value, country : country_msg.dom.value, specreq : specreq_msg.dom.value },
                            method: 'GET',
                            success: function ( result, request ) { 
                                //Ext.MessageBox.alert('Success', 'Data return from the server: '+ result.responseText);
								Ext.MessageBox.show({
								   title: 'Important',
								   msg: result.responseText,
								   buttons: Ext.MessageBox.OK,
								   width : 300,
								   icon: Ext.MessageBox.INFO
							   });							
								
								//Ext.MessageBox.alert('Important', result.responseText);
                            },
                            failure: function ( result, request) { 
                                Ext.MessageBox.alert('Failed', 'Please, verify your information.'); 
                            } 
                        });
                    }
                },{
                    text     : 'Clear',
                    handler: function(){ simple.form.reset(); }
         }]
    });

    

});