/* 
 * To change this template, choose Tools | Templates
 * and open the template in the editor.
 */

/*
 * Ext JS Library 2.1
 * Copyright(c) 2006-2008, Ext JS, LLC.
 * licensing@extjs.com
 * 
 * http://extjs.com/license
 */


function loadContactusForm() {
    var simple;
  
    var subjectList = [
        ['To subscribe a publication','To subscribe a publication'],
        ['To request for media kit of a publication','To request for media kit of a publication'],
        ['To submit an article / press release','To submit an article / press release'],
        ['Others','Others']
       
    ];

    var buttonHandler = function(button,event) {
        simple.form.submit({
            method:'POST',
            url:'ControllerServlet?action=contactpost',
            waitMsg:'Sending data...',
            failure:function(f,a){
                Ext.MessageBox.alert('Error', 'Error in sending enquiry');
            },
            success:function(f,a){
                Ext.MessageBox.alert('Information', 'Your enquiry details has been sent!');
                window.close();
            }
        });
    };
    // turn on validation errors beside the field globally
    //Ext.form.Field.prototype.msgTarget = 'side';
    //    var store = new Ext.data.SimpleStore({
    //       fields: ['title'],
    //     data : titlesList // from states.js
    // });

 

    simple = new Ext.FormPanel({
        labelWidth: 110, // label settings here cascade unless overridden
        url:'ControllerServlet?action=contactpost',
        layout:'form',
        frame:true,
        title: 'On-line Form',
        bodyStyle:'padding:5px 5px 5px 5px;  z-index:300001;',
        width: 300,
        defaults:{ width: 300},
        defaultType: 'textfield',
        xtype:'form',
        autoHeight:true,
        items: [          
            new Ext.form.ComboBox({
                store: subjectList ,                 
                name:'subject',
                fieldLabel: 'Subject',   
                displayField:'Subject',
                allowBlank:false,
                typeAhead: true,
                triggerAction: 'all',
                emptyText:'Select a subject...',        
                selectOnFocus:true,
                forceSelection :true
                   
            }),{
                // Use the default, automatic layout to distribute the controls evenly
                // across a single row
                xtype: 'checkboxgroup',
                fieldLabel: 'Publications',
                columns: 2,
                items: [
                    {boxLabel: 'Bathroom + Kitchen Today', name: 'C1'},
                    {boxLabel: 'Concrete Technology Today', name: 'C1'},
                    {boxLabel: 'Security Solutions Today', name: 'C3'},
                    {boxLabel: 'Landscape Today', name: 'C4'},
                    {boxLabel: 'Lighting Today', name: 'C5'},
                    {boxLabel: 'SEA Building', name: 'C6'},
                    {boxLabel: 'SEA Construction', name: 'C7'}
                ]
            },

            {
                fieldLabel: 'First Name',
                name: 'Name0',
                width:150,
                allowBlank:false
                
            },
            {
                fieldLabel: 'Last Name',
                name: 'Name1',        
                width:150,
                allowBlank:false
                
            },{
                fieldLabel: 'E-mail Address)',
                name: 'Email',
                width:200,
                vtype:'email',
                allowBlank:false
            },
            {
                fieldLabel: 'Company Name',
                name: 'Company',
                width:200,
                allowBlank:false
            },
            new Ext.form.TextArea({                      
                fieldLabel: 'Company Address',
                allowBlank: false,
                name: 'Address1',
                height: 30,
                width:200
            })
            ,{
                fieldLabel: 'Company Tel.',
                name: 'Telephone',
                width:150,
                allowBlank:false
            },{
                fieldLabel: 'Company Fax.',                 
                name: 'Fax',
                width:150,
                allowBlank:false
            },
            new Ext.form.TextArea({                      
                fieldLabel: 'Message',
                allowBlank: false,
                name: 'Comments',
                height: 50,
                width:200
            })
        ],
        buttons: [{
                text: 'Send',
                handler:buttonHandler
            }]
    });
   
    var window = new Ext.Window({
        title: 'Subscribe/Contact Us',
        y:5,
        modal :true,
        width:500,
        height:500,
        minWidth: 500,
        minHeight: 500,
        layout: 'fit',
        plain:true,
        autoHeight:true,
        bodyStyle:'padding:5px;',
        buttonAlign:'center',
        border:false,
        items: simple
  
    });

    window.show();
};