Ext.ns('Ext.app');

Ext.app.ContactForm = Ext.extend(Ext.FormPanel, {
    formTitle
: 'Contact Information (English)',
    firstName
: 'First Name',
    lastName
: 'Surname',
    surnamePrefix
: 'Surname Prefix',
    company
: 'Company',
    state
: 'State',
    stateEmptyText
: 'Choose a state...',
    email
: 'E-mail',
    birth
: 'Date of Birth',
    save
: 'Save',
    cancel
: 'Cancel',
   
    initComponent
: function(config) {
       
Ext.apply(this, {
            labelWidth
: 100, // label settings here cascade unless overridden
            url
:'save-form.php',
            frame
:true,
            title
: this.formTitle,
            bodyStyle
:'padding:5px 5px 0',
            width
: 370,
            defaults
: {width: 220},
            defaultType
: 'textfield',
   
            items
: [{
                    fieldLabel
: this.firstName,
                    name
: 'firstname',
                    allowBlank
:false
               
},{
                    fieldLabel
: this.lastName,
                    name
: 'lastName'
               
},{
                    fieldLabel
: this.surnamePrefix,
                    width
: 50,
                    name
: 'surnamePrefix'
               
},{
                    fieldLabel
: this.company,
                    name
: 'company'
               
},  new Ext.form.ComboBox({
                    fieldLabel
: this.province,
                    hiddenName
: 'state',
                    store
: new Ext.data.ArrayStore({
                        fields
: ['provincie'],
                        data
: Ext.exampledata.dutch_provinces // from dutch-provinces.js
                   
}),
                    displayField
: 'provincie',
                    typeAhead
: true,
                    mode
: 'local',
                    triggerAction
: 'all',
                    emptyText
: this.stateEmtyText,
                    selectOnFocus
:true,
                    width
:190
               
}), {
                    fieldLabel
: this.email,
                    name
: 'email',
                    vtype
:'email'
               
}, new Ext.form.DateField({
                    fieldLabel
: this.birth,
                    name
: 'birth'
               
})
           
],
   
            buttons
: [{
                text
: this.save
           
},{
                text
: this.cancel
           
}]
       
});
       
       
Ext.app.ContactForm.superclass.initComponent.apply(this, arguments);
   
}
});

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

   
// turn on validation errors beside the field globally
   
Ext.form.Field.prototype.msgTarget = 'side';
   
   
var bd = Ext.getBody();
   
    bd
.createChild({tag: 'h2', html: 'Localized Contact Form'});
       
   
// simple form
   
var simple = new Ext.app.ContactForm();
    simple
.render(document.body);
});