Ext.onReady(function(){

	Ext.QuickTips.init();

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

	var bd = Ext.getBody();

   var simple = new Ext.FormPanel({
       labelWidth: 100, // label settings here cascade unless overridden
       url:'includes/submit-contact-form.php',
       frame:true,
       title: 'Please feel free to contact us also using the form below',
       bodyStyle:'padding:5px 5px 0',
       width: 450,
       defaults: {width: 300},
       defaultType: 'textfield',

       items: [{
               fieldLabel: 'Name',
               name: 'name',
               allowBlank:false
           },{
               fieldLabel: 'Telephone no.',
               name: 'tel',
               allowBlank:false
           },{
               fieldLabel: 'Email',
               name: 'email',
               vtype:'email'
           }, new Ext.form.TextArea({
					fieldLabel: 'Comments',
					name: 'comments',
					width: 200,
					allowBlank:false
				})
		],

      buttons: [{
         text: 'Submit',
			handler: function(){
				simple.form.submit({
					waitMsg:'Processing...',
					success: function(form, action) {
              		Ext.MessageBox.alert('Thankyou','Your enquiry/comments have been sent.');
						simple.disable();
					},
					failure: function(form, action) {
              		Ext.MessageBox.alert('Problem','Please ensure you have filled in all the required fields.');
					}
				})
			}
      },{
         text: 'Reset',
			handler: function(){
				simple.form.reset()
			}
      }]
	});

   simple.render('contactForm');

});